jQuery使用2个提交按钮提交ajax表单

即时通讯尝试实现以下，在PHP我有一个这样的forms：

表单操作文件是：

   alert("")    

所以这意味着如果我按下带有值的sub，就会出现一个警告提示，我怎么能做同样的事情（区分提交）但是使用Ajax请求：

以下代码不起作用：

  $(function(){ $('form#form_1').submit(function(){ var _data= $(this).serialize() $.ajax({ type: 'POST', url: "php.php?", data:_data, success: function(html){ $('div#1').html(html) } }) }) })    
 
   
  

Answer 1

您可以将事件处理程序放在按钮上而不是表单上。 从表单中获取参数，然后为按钮添加参数，并发布表单。 确保处理程序返回“false”。

 $(function() { $('input[name=sub]').click(function(){ var _data= $('#form_1').serialize() + '&sub=' + $(this).val(); $.ajax({ type: 'POST', url: "php.php?", data:_data, success: function(html){ $('div#1').html(html); } }); return false; }); }); 

您必须显式添加“sub”参数，因为当您调用“serialize（）”时jQuery不包含这些参数。

Answer 2

在这种情况下，您需要手动将提交按钮添加到发布的数据，如下所示：

 $(function(){ $('form#form_1 :submit').submit(function(){ var _data = $(this).closest('form').serializeArray(); //serialize form _data.push({ name : this.name, value: this.value }); //add this name/value _data = $.param(_data); //convert to string $.ajax({ type: 'POST', url: "php.php?", data: _data, success: function(html){ $('div#1').html(html); } }); return false; //prevent default submit }); }); 

我们使用.serializeArray()来获取表单的序列化版本（ 这是.serialize()内部使用的 ）， 在通过$.param()将序列化为字符串之前将我们的名称/值对添加到该数组中。

最后一个添加是return false以防止出现页面的默认提交行为。

Answer 3

很多分号丢失，见下文

  $(function(){ $('form#form_1').submit(function(){ var _data= $(this).serialize(); $.ajax({ type: 'POST', url: "php.php?", data:_data, success: function(html){ $('div#1').html(html); } }); }); }); 

Answer 4

jQuery Form插件提供了一些先进的function，它已经自动执行了一些我们必须手动完成的任务，请看一下。 它还提供了更好的处理表单元素的方法，序列化，您可以在提交表单之前插入预处理函数。