Phương thức clearQueue
Phương thức clearQueue cho phép chúng ta xóa khỏi
hàng đợi tất cả các hàm chưa được khởi chạy.
Cú pháp
Chúng ta có thể xóa hàng đợi các hàm như thế này. Có thể truyền
tham số tùy chọn là tên hàng đợi
dưới dạng chuỗi (mặc định là fx - hàng đợi
hiệu ứng tiêu chuẩn). Nếu không truyền bất kỳ
tham số nào, thì tất cả các
hàm còn lại sẽ bị xóa khỏi hàng đợi fx:
.clearQueue([tên hàng đợi]);
Phương thức này tương tự như phương thức
stop. Nhưng,
nếu phương thức cuối cùng chỉ có thể làm việc với hoạt ảnh, thì
clearQueue cho phép làm việc với bất kỳ hàng đợi jQuery nào,
đã được thêm vào bằng phương thức
queue.
Ví dụ
Hãy để khi nhấp vào nút #start,
chúng ta sẽ khởi chạy hoạt ảnh. Khi nhấp vào
nút #stop, chúng ta sẽ dừng hoạt ảnh
và xóa hàng đợi bằng phương thức
clearQueue. Khi nhấp lại vào
#start, hoạt ảnh sẽ bắt đầu lại từ đầu:
<button id="start">start</button>
<button id="stop">stop</button>
<div></div>
div {
position: absolute;
margin: 3px;
width: 50px;
height: 50px;
left: 0px;
top: 30px;
background: red;
display: none;
}
div.newcolor {
background: green;
}
$('#start').click(function() {
let myDiv = $('div');
myDiv.show('slow');
myDiv.animate({
left: '+=200'
}, 5000);
myDiv.queue(function() {
let that = $(this);
that.addClass('newcolor');
that.dequeue();
});
myDiv.animate({
left: '-=200'
}, 1500);
myDiv.queue(function() {
let that = $(this);
that.removeClass('newcolor');
that.dequeue();
});
myDiv.slideUp();
});
$('#stop').click(function() {
let myDiv = $('div');
myDiv.clearQueue();
myDiv.stop();
});