jQuery複数のハンドラー登録の問題

Question

私のページには、クリックごとに行を追加するボタンがあります。 私はこのコードを使用：

$('#addCnt').live('click', function() { .. }; 

問題は、私は一緒にそのコードとのページの一部をリロードするとき、それは再びハンドラを登録しているので、ボタンは、それが行のN数、Nを付加することを後にクリックされたときに、 =総ページリロードの数。

どうすればそれを防ぐことができますか？

Answer 1

イベントハンドラをアタッチするコードが決して複数回実行されないようにする必要があります。したがって、このコード：

$('#addCnt').live('click', function() { .. }; 

は複数回実行しないでください。あなたが複数回実行されることから、これを防ぐために、あなたのコードを再構築することができない場合は、あなた自身のグローバルフラグを作成することができます

それを保護します

if (typeof window.addCntProtection == "undefined") { 
    window.addCntProtection = false; 
} 
if (!window.addCntProtection) { 
    $('#addCnt').live('click', function() { .. }; 
    window.addCntProtection = true; 
} 

ちなみに、jQueryのは.live()の使用は推奨されていませんそれはもはやどのバージョンのjQueryでも推奨されません。以前のバージョンのjQueryでは、.on()をjQuery 1.7+または.delegate()に使用することをお勧めします。

Answer 2

セレクタでliveを使用している場合は、それを一度だけ添付する必要があり、ページ上の任意の数の要素で機能します。

liveハンドラをコードの外に取り付けてページの一部をリロードすると、正常に動作するはずです。

Answer 3

jQuery 1.7以降、the .live() method is deprecated。イベントハンドラを添付するには.on()を使用してください。

.off()でページを更新する前に、イベントハンドラを削除してください。 例：あなたが望むよう

$('#addCnt').on('click',function(){ 
    alert('Clicked.'); 
}); 

$('#a').on('click',function(){ 
    $('#addCnt').on('click',function(){ 
     alert('Clicked.'); 
    }); 
}); 

$('#r').on('click',function(){ 
    $('#addCnt').off('click'); 
}); 

http://jsfiddle.net/WccQy/

あなたはできるだけ多くのハンドラを追加することができます。 .off()は、すべてを削除します。 jsfiddleを見てみましょう！