Selectorに複数の要素を追加した.load（）を1回だけ行う方法は？

Question

本当にストリップダウンバージョン：

シナリオ私はアニメーション化し、それがload()がtriggerdがelement_Aとelement_Bのために2倍になると思われる​​ を使用して外部のページをロードしています2つのセレクタ... は、それを持ってする方法はあります一度トリガー？

$('.element_A, .element_B').click(function(){ 

    //... 

    $(".element_C").load("someFile", etc); 

    //... 

}); 

Answer 1

パトリックDWは、ソリューションの基盤を構築しました。負荷が1回だけトリガされるためには、何らかの種類のインジケータを追加する必要がありました。

$temp_LoadCounter = 0; // added 

$('.element_A, .element_B').click(function(){ 

    //... 

    $temp_LoadCounter += 1; // added 

    if ($temp_LoadCounter == 1) { // added 

     $(".element_C").load("someFile", etc); 

    //... 

    } // added 

}); 

Answer 2

​​がすでに実行されているかどうかを示すフラグを使用します。必要に応じて

var triggered = false; // our flag 

$('.element_A, .element_B').click(function(){ 
     // if it hasn't run yet, run it and set "triggered" to "true" 
    if(!triggered) { 
     $(".element_C").load("someFile", etc); 
     triggered = true; 
    } 
}); 

あなたはloadのためのコールバックで戻っfalseにそれを設定することができます。

2回発射した理由は、セレクタ内の要素の1つが他の要素の内部にネストされている場合は、イベントがバブリングしているためです。

return false;またはevent.stopPropagation()^(docs)メソッドでバブリングを防ぐことができます。

$('.element_A, .element_B').click(function(event){ 
     // prevent the event from bubbling and triggering the handler again 
    event.stopPropagation(); 

    $(".element_C").load("someFile", etc); 

});