2011-07-14 8 views
2

私のような動的divの「ラップ」に追加要素を、持っている:jqueryのundelegateヘルプ

<div id='wrap'> 
    <div id="one">apple</div> 
    <div id="two">pear</div> 
</div> 

子のdivはAJAX呼び出しに行くイベントをクリックしています。

$('#wrap').delegate('div', 'click', getInfo); 

私は、クリックされた特定のdivからクリックイベントをundelegateたいです。言い換えると、div#1がクリックされた場合、そのイベントはdiv#1から削除されませんが、div#2に委任されたままになります。

おかげ

答えて

1

あなたが将来的にそれらをフィルタリング終わるでしょうdivのクリックし、クラスを追加することができます。

$('#wrap').delegate('div:not(.clicked)', 'click', function(event) { 
    // You could just add this to getInfo instead of calling it from the handler: 
    $(this).addClass("clicked"); 
    getInfo.call(this, event); 
}); 

をここに例を示しますhttp://jsfiddle.net/7EpSK/

+0

「outta the box 'タイ – zack

3

delegate()[docs]方法が採用しているためイベントデリゲーションには、コンテナ#wrapに割り当てられているハンドラが1つしかないため、それまでバブルするすべてのクリックイベントが処理されます。

解決策の1つは、イベントがバブリングするのを防ぐハンドラをクリックした要素に追加することです。

$('#wrap').delegate('div', 'click', getInfo); 

function getInfo() { 
    $(this).bind('click',false); 
    // rest of the code 
} 

これは、クリックされた要素にハンドラをバインドします。ハンドラは何もしませんが、イベントの伝播を防ぎます(既定の動作を防ぎますが、<div>の既定の動作はありません)。

例:http://jsfiddle.net/mzvHK/

0

これはちょうどより多くの選択肢の直接の答えではありません。

$('#wrap div').one('click', getInfo); 
:あなたの要素ごとに一度だけ発生させたイベントを行います

jQueryの.one()

参照:http://api.jquery.com/one/