フォーム投稿がJqueryとAjaxを使用してサブミットした後に2回動作しない

Question

AJAXとJqueryを使用してデータを内部的に送信するPHPページを作成しました。なお、基準

$(function(){ 
    $('#sub').click(function(){ 
     $('#myForm').on('submit',function(e){ 
      e.preventDefault(); 
      $.ajax({ 
       url:"file.php", 
       type:'POST', 
       data:new FormData(this), 
       contentType: false, 
       processData:false, 
       success:function(data){ 
        $("#myResponse").replaceWith(data);} 
       }); 
      }); 
     }); 
    }); 
}); 

のコードはこれが

<input type="submit" value="Submit" name="submit" id="sub" onclick="submitForm('file.php')" data-toggle="modal" data-target="#myModal"> 

Answer 1

から内側にボタンを提出されている。ここ ...正常に動作しますが、私は再び提出する（2回目）をクリックすると、後の提出、それは起こりません。

他のクリックイベントを削除し、あなたの提出イベント

$('body').on('submit','#myForm', function(e) { 
    e.preventDefault(); 
    $.ajax({ 
    url: "file.php", 
    type: 'POST', 
    data: new FormData(this), 
    contentType: false, 
    processData: false, 
    success: function(data) { 
     $("#myResponse").replaceWith(data); 
    } 
    }); 
}); 

Answer 2

は、入力タイプから（onclickの= "submitForm（ 'file.php'）を"）を削除し委任する。また、 "$（ '＃sub'）を削除する。click（function（）{}）;" 。それだけのように保つ：

$('#myForm').on('submit',function(e){ 
    e.preventDefault(); 
    $.ajax({ 
    url:"file.php", 
    type:'POST', 
    data:new FormData(this), 
    contentType: false, 
    processData:false, 
    success:function(data){ 
    $("#myResponse").replaceWith(data);} 
    }); 
    }); 
    });