表单提交在使用JQuery和Ajax提交后不再工作

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

内按钮

删除其他点击事件，委托你提交事件

$('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);} 
    }); 
    }); 
    });