Sự kiện kích hoạt Jquery lập trình và đợi cho đến khi hành động của sự kiện trước đó hoàn tất để kích hoạt một lần tiếp theo

Question

Tôi là người mới làm quen với jquery. Giả sử tôi có một danh sách gồm 10 thẻ "a" gắn liền với một trình xử lý sự kiện, nhấp chuột, di chuyển tương ứng.
điều tôi muốn làm là lặp qua tất cả các phần tử "a" và kích hoạt các sự kiện này bằng trình kích hoạt jquery.
Vấn đề tôi phải đối mặt là, những sự kiện này đôi khi được kích hoạt, do đó khi tôi chạy mã, tất cả tôi chỉ thấy kết quả thay đổi chỉ trên phần tử cuối cùng. Và không phải là trung gian.

$.each($("#styles a"), function(){ 
    console.log("picked up " + $(this)); 
    setTimeout(qwe($(this)), 2000); 
}); 

function qwe(obj) { 
    console.log(obj.attr("id")); 
    $.when(obj.trigger("mouseover").trigger("click").trigger("mouseout")) 
     .then(function() { 
      console.log("Changing Result Value" + $("#textTag").text()); 
     }); 
} 

Có cách nào để chuỗi những sự kiện liên tục ví dụ:
sự kiện thứ hai Yếu tố cần được trigged chỉ khi hành động kích hoạt trong những yếu tố đầu tiên là hoàn tất. tôi đã thử tìm kiếm trên SO, nhưng chủ yếu là các bài viết xoay quanh việc kích hoạt sự kiện duy nhất. Cảm ơn

Answer 1

Tạo $ .Deferred đối tượng cho mỗi một phần của chuỗi, sau đó ràng buộc họ phải được giải quyết khi các sự kiện đang thực sự kích hoạt:

callbacks = [$.Deferred(), $.Deferred(), $.Deferred()]; 
obj.on('mouseover', callbacks[0].resolve); 
obj.on('click', callbacks[1].resolve); 
obj.on('mouseout', callbacks[2].resolve); 
$.when(callbacks).done(function() { console.log('all three have fired'); }); 

Bạn sẽ cần logic thêm để đảm bảo rằng thứ tự là được bảo tồn - có thể bằng cách sử dụng 'từ chối' nếu nhấp chuột không được kích hoạt trước khi di chuột.