NỘI DUNG BÀI VIẾT
Định nghĩa
Phương thức
clearInterval()
được sử dụng để xóa nhiệm vụ mà ta đã thiết lập trong phương thức
setInterval()
.
Cú pháp
clearInterval(var)
Code language: JavaScript (javascript)
Trong đó:
Tham số | Mô tả |
var | Bắt buộc. Tên của biến để truyền vào phương thức
clearInterval()
|
Ta phải đặt phương thức
setInterval()
trong một biến để truyền vào phương thức
clearInterval()
thì mới có thể thực thi được.
myVar = setInterval("javascript function", milliseconds);
clearInterval(myVar);
Code language: JavaScript (javascript)

Ví dụ
Ví dụ 1: Hiển thị thời gian hiện tại giống như đồng hồ kỹ thuật số và sử dụng
clearInterval()
để dừng thời gian
var myVar = setInterval(myTimer, 1000);
function myTimer() {
var d = new Date();
var t = d.toLocaleTimeString();
document.getElementById("demo").innerHTML = t;
}
function myStopFunction() {
clearInterval(myVar);
}
Code language: JavaScript (javascript)
Ví dụ 2: Chuyển đổi giữa hai màu nền cứ sau 300 mili giây một lần, cho đến khi nó dừng lại bởi
clearInterval()
var myVar = setInterval(setColor, 300);
function setColor() {
var x = document.body;
x.style.backgroundColor = x.style.backgroundColor == "yellow" ? "pink" : "yellow";
}
function stopColor() {
clearInterval(myVar);
}
Code language: JavaScript (javascript)
Ví dụ 3: Sử dụng
setInterval()
và
clearInterval()
để tạo thanh Progress bar (tiến trình) động
function move() {
var elem = document.getElementById("myBar");
var width = 0;
var id = setInterval(frame, 100);
function frame() {
if (width == 100) {
clearInterval(id);
} else {
width++;
elem.style.width = width + '%';
}
}
}
Code language: JavaScript (javascript)
Kết luận
Như vậy, phương thức
setInterval()
sẽ thực thi hàm lặp đi lặp lại cho đến khi phương thức
clearInterval()
được gọi hoặc cửa sổ bị đóng (tải lại trang). Phương thức
clearInterval()
sẽ xóa nhiệm vụ mà ta đã thiết lập trong phương thức
setInterval()
.
Xem thêm:
Các bạn có thể tham khảo các bài viết hay về JavaScript tại đây.
Hãy tham gia nhóm Học lập trình để thảo luận thêm về các vấn đề cùng quan tâm.