如何在 jQuery 异步中提交表单？

Posted 2023-05-09

【中文标题】如何在 jQuery 异步中提交表单？

【英文标题】：How do I submit a form in jQuery async?

【发布时间】：2012-04-13 14:22:21

【问题描述】：

在 mootools 我会做类似$('form_id').send(success:function(res)....); jQuery中的并行语法是什么？

另外一句话： 如何将我的表单数据（假设 id='bob'）放入以下代码

$.ajax(
  type: 'POST',
  url: url,
  data: data,
  success: success,
  dataType: dataType
);

【参考方案1】：

应该这样做：

$.ajax(   
   type: 'POST',   
   url: url,   
   data: $('#bob').serialize(),
   success: success,
   dataType: dataType 
); 

【参考方案2】：

您不知道吗...它就在文档中！ :P

http://api.jquery.com/jQuery.ajax/

编辑：好吧好吧...

$('#too_cool_form').submit(function(e)
  e.preventDefault();
  //do some verification
  $.ajax(
    url: '',
    data: $(this).serialize(),
    success: function(data)
    
      //callback methods go right here
    
  );
);

【讨论】：

我真的不应该懒得去查文档，其实是“jQuery.ajax( url [, settings ] )”。

【参考方案3】：

jQuery 附带的任何内容都不会自动为您生成一个标准表单。

选项 1 -- 拦截表单的submit 事件，使用serialize 从表单字段中抓取数据，并使用ajax 或post 发送，按照建议。

选项 2 -- 使用这个很棒的 forms plugin，它会为您完成所有选项 1。

【讨论】：

序列化是不是 AJAXification。我不同意你的不同意见，@MatthewBlancarte

也许我们应该从定义 AJAXification 开始......我不认为我们在同一个页面上。 :)

@MatthewBlancarte AJAXification 是我的选项 1，也是您的答案。 jQuery 不会自动增强像 mootools'$('form_id').send() 这样的表单。

啊，好吧。我明白你在说什么。只是多了一层抽象。

@MatthewBlancarte 酷。如果您不再认为这是错误的，我可以收回我的投票吗？ :)

【参考方案4】：

$.post() 或 $.ajax()

$.ajax(
  type: 'POST',
  url: url,
  data: data,
  success: success,
  dataType: dataType
);

文档会解释得最好：http://api.jquery.com/jQuery.post/