0

複数の送信を防ぐ方法が必要です。

$("#myDiv").click(function(e) {
    e.preventDefault();
    console.log('open');

    // submit the form    
    $('#myDiv #myInput').click(function(e){
        e.preventDefault();
        /* ajax call here */
        console.log('clicked');
    });

});

したがって、クリックしたときに#myDivX回送信している場合は、子関数をクリックします。

例えば。3回#myDivクリックしてからクリック#myInputするとフォームが3回送信され、もう一度押すと6が送信されます。

それを修正する方法はありますか？

4

1 に答える 1

2

クリックイベントハンドラーを複数回バインドしているようです$('#myDiv #myInput')。

$('#myDiv #myInput').click(function(e){のクリックハンドラの外側に移動するか、を$("#myDiv").click(function(e) {使用する必要があります.one(。どちらの場合も動作が異なることに注意してください。

また、 event.stopPropagation（）;を使用する必要があります。イベントのバブリングを停止します。

要件に応じて、以下のコードを試してください。以下の項目1.と2.は動作が異なるため、コードを理解し、要件に従って実装してください。

  1. #myInputクリックイベントを外部に移動する

    $("#myDiv").click(function(e) {
e.preventDefault();
e.stopPropagation();
console.log('open');
});

// submit the form    
$('#myDiv #myInput').click(function(e){
   e.preventDefault();
   e.stopPropagation();
   /* ajax call here */
   console.log('clicked');
 });

  2. #myInputのクリックハンドラーは1回実行されることに注意してください。

    $("#myDiv").click(function(e) {
   e.preventDefault();
   e.stopPropagation();
   console.log('open');

   // submit the form    
   $('#myDiv #myInput').one(function(e){
    e.preventDefault();
    e.stopPropagation();
    /* ajax call here */
    console.log('clicked');
   });
});
于 2012-01-12T18:59:16.267 に答える