Jquery Triggerイベントをプログラムで処理し、前のイベントの処理が完了して次のイベントが発生するまで待ちます

Question

jqueryの初心者です。 イベントハンドラのmouseover、click、mouseoutにそれぞれ10個の「a」タグがすべて関連付けられているとします。
私がしたいことは、すべての "a"要素を反復処理し、jqueryトリガを使用してこれらのイベントをトリガすることです。
私が直面している問題は、これらのイベントがいつかトリガされるためです。したがって、コードを実行すると、すべての結果が最後の要素でのみ変化することがわかります。そして、中間体ではありません。

$.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()); 
     }); 
} 

チェーンへの道は、これらのイベントが順次すなわち
第二の要素のイベントは、最初の要素のトリガー・アクションが完了したときにのみtriggedする必要がありますあります。私はそんなことを探そうとしましたが、たいていの記事はただ一つの出来事を誘発することを中心に回っています。 おかげ

Answer 1

は、イベントが実際にトリガーされたときに解決するためにそれらを結合し、その後、チェーンの各部分のために$ .Deferredオブジェクトを作成します。

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'); }); 

あなたは順序があることを確認するために追加のロジックを必要とするだろう保存されました。おそらく、mouseoutの前にクリックがトリガーされない場合、「拒否」を使用します。