3 
$('#div1').on('click', '#otherDiv1', function(event){       
        //Show popup
        $('#popupDiv').bPopup({
            modalClose: false,
            follow: [false, false],
            closeClass: 'close'
        });             
        event.stopPropagation();

        $('#div2').on('click', '#otherDiv2', function (event) { 

             // here is ajax request         

            // close popup          
            $('#popupDiv').bPopup().close();
            event.stopPropagation();
        });

    }

otherDiv2 をクリックすると、ajax 関数が何度も呼び出されます。これを停止するにはどうすればよいですか?

HTMLコード

<div id="div2">

<div id="div1"><div id="otherDiv1">Click</div></div>

    <div id="popupDiv"><div class="close">X</div> 
        <input id="otherDiv2" name="otherDiv2" type="submit" value="Click" />   
    </div>
</div>

popupDiv は動的に作成されます

otherDviv1 をクリックすると、ポップアップが開き、その中に ajax リクエストのボタンがあります。ボタンをクリックすると、リクエストが呼び出され、ポップアップが閉じられます。もう 1 回 otherDiv1 とボタンをクリックすると、リクエストが 2 回呼び出されます。

ありがとう

4

3 に答える 3

4

click秒を別の 内にバインドする必要はありませんclick。あなたのコードは、それぞれにバインドclickします。次のプロセスでは必要ありません。#otherDiv2click#otherDiv1stopPropagation()

$('#div1').on('click', '#otherDiv1', function(event) {
    //Show popup
    $('#popupDiv').bPopup({
        modalClose: false,
        follow: [false, false],
        closeClass: 'close'
    });
});

$('#div2').on('click', '#otherDiv2', function(event) {

    // here is ajax request         
    // close popup          
    $('#popupDiv').bPopup().close();
});

ただし、イベントを別のイベント内にバインドする必要がある場合は、最初にイベントをアンバインドしてから#otherDiv2再度バインドします。

$('#div1').on('click', '#otherDiv1', function(event) {
    //Show popup
    $('#popupDiv').bPopup({
        modalClose: false,
        follow: [false, false],
        closeClass: 'close'
    });

    $('#div2').off('click').on('click', '#otherDiv2', function(event) {

      // here is ajax request         
      // close popup          
      $('#popupDiv').bPopup().close();
   });
});
于 2012-08-08T13:38:18.447 に答える
1

私はあなたが使用できると思います

event.stopImmediatePropagation()

泡立ちを止める。

http://api.jquery.com/event.stopImmediatePropagation/

于 2012-08-08T13:43:10.863 に答える
0

jQuery のかなり新しいバージョンを使用する場合、すべての ajax リクエストはDeferredオブジェクトを返します。これをクリック ハンドラの外側のスコープに保存して分析し、既存のリクエストをキャンセルするか、新しいリクエストを開始しないようにします。

また、スロットリングと呼ばれる概念があり、それを行う jquery 用のプラグインがあります。

于 2012-08-08T13:42:25.820 に答える