Jquery .submit with function() 不起作用

Question

我正在使用 Jquery，如果单击链接或执行某些操作，我想自动更新页面上的表单。如果我使用 .submit() 它工作正常，如果我使用 .submit(function(e){}) 表单将不会提交。我需要从表单提交中获得响应，这就是为什么我需要 .submit(function(e){}) 来处理 .submit()。谢谢。

我有一个表格：

  <form action="action.html" id="form1">
  </form>

我有一个链接：

 <a href="" data-id="1" class="myLink">Link</a>

当我点击链接时，我会执行以下操作：

 $(document).on('click', '.myLink', function(e) {
      // this will call a function to submit my form...
      var response = saveEmailDraft($(this).data('id'));
      e.preventDefault();
 });  

 function saveEmailDraft(id){
      $('#form' + id).submit(); // this works fine...
      $('#form' + id).submit(function(e){
          // this DOES NOT work...
          alert('my form submitted!');
      }); 

      // I've also tried;
      $(document).ready(function() {
           $('#form' + id).submit(); // this works fine...
           $('#form' + id).submit(function(e){
               // this DOES NOT work...
               alert('my form submitted!');
           });
      });

 }

Answer 1

您需要在提交表单之前绑定事件处理程序。

function saveEmailDraft(id){
    $('#form' + id).submit(function(e){
        alert('my form submitted!');
    }); 
    $('#form' + id).submit();
}

但这不会让您从表单提交中获得响应。事件处理程序在表单数据发送到服务器之前执行。提交表单后，页面会重新加载，并且所有当前脚本都会停止运行。

如果你想得到响应，你需要使用$.ajax（或者像$.get或$.post这样的快捷方式）而不是.submit()。