jQuery的serializeArray不包括被点击的提交按钮

我有一个窗体，有两个按钮。一个用于保存记录，另一个用于取消保存过程。我正在使用rails.js（这是您不熟悉的那些常用AJAX/jQuery插件） JavaScript文件，与jQuery一起使用，用于不显眼的javascript/ajax调用。当我通过ajax发送表单数据时，我希望我单击的按钮的名称和值与其余数据一起提交，以便我可以根据单击哪个按钮来决定做什么。jQuery的serializeArray不包括被点击的提交按钮

rails.js文件中的方法使用.serializeArray()将表单数据发送到服务器。问题是这不包括我点击的按钮的名称/值对。 jQuery的网站上说，他们这样做的目的（eventhough他们应该在其个人意见）：

“的.serializeArray()方法使用标准的W3C规则successful controls，以确定哪些元素应该包括;特别元素不能被禁用，必须包含一个name属性，因为没有使用按钮提交表单，因此没有提交按钮值被序列化。“

他们怎么能假定表单没有用按钮提交？我相信这是毫无意义和错误的假设。

根据W3C规则，为提交表单而激活的按钮被视为成功控件。

由于jQuery的开发者已经决定这么做，我可以假设有另一种方法，不是排除序列化中激活的按钮吗？

编辑：这是我的形式可能是什么样子简单的例子...

<!DOCTYPE html5> 
<html> 
<head> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js" type="text/javascript"></script> 
<script type="text/javascript"> 
    $(document).ready(function() { 
    $('#form').submit(function(e) { 
     // put your breakpoint here to look at e 
     var x = 0; 
    }); 
    }); 
</script> 
</head> 
<body> 
    <form id="form"> 
    <input name="name" type="text"><br/> 
    <input name="commit" type="submit" value="Save"/> 
    <input name="commit" type="submit" value="Cancel"/> 
    </form> 
</body>

来源

2010-10-24 DJTripleThreat

对于大家有没有发现，同样的问题与''

没有，行为是基于<form>，不的submit事件例如按钮在JavaScript中输入或拨打.submit()。您在这里混合使用2个概念，.serialize()或.serializeArray()可能会或可能不会有任何东西做一个按钮点击 - 它只是一个单独的事件，他们没有连接。这些方法的级别高于此：您可以出于任何原因随时序列化表单（或其子集）。

但是，您可以添加提交名称/值对像一个正常的形式从该按钮提交会的，如果你从一个按钮提交例如：

$("#mySubmit").click(function() { var formData = $(this).closest('form').serializeArray(); formData.push({ name: this.name, value: this.value }); //now use formData, it includes the submit button });

来源

2010-10-24 11:04:30

@尼克，感谢您的快速回复。我将编辑'rails.js'（并可能提交补丁）以完成此工作。我会给这个镜头。 – DJTripleThreat 2010-10-24 11:10:57

@DJTripleThreat - 我不熟悉他们的代码，是否有可能在外部替换事件处理程序？如果你可以发布它，我会看看 – 2010-10-24 11:12:06

@Nick - 检查gh上的文件：http://github.com/rails/jquery-ujs/blob/master/src/rails.js。看看第34行和第76行的处理程序。有没有办法找出在'.submit（function（e）{}）''传递的'event'对象中单击了哪个按钮？ – DJTripleThreat 2010-10-24 11:49:25

我用下面的代码片段，基本上是增加与同名的隐藏元素

var form = $("form"); 
$(":submit",form).click(function(){ 
      if($(this).attr('name')) { 
       $(form).append(
        $("<input type='hidden'>").attr({ 
         name: $(this).attr('name'), 
         value: $(this).attr('value') }) 
       ); 
      } 
     }); 

$(form).submit(function(){ 
    console.log($(this).serializeArray()); 
});

来源

2012-06-30 05:57:31 digitalPBK

这个解决方案是“通用”作为它会处理所有的输入提交，每个传递上提交一个表单变量。

$(document).ready(function(){ 
    $('input:submit').each(function(){ 
     $(this).click(function(){ 
      var formData = $(this).closest('form').serializeArray(); 
      formData.push({ name: $(this).attr('name'), value: $(this).val() }); 
     }); 
    }); 
});

来源

2013-03-20 21:44:01

你不需要'each'调用 - 直接在代表所有输入元素的jquery对象上直接调用'click' – SpoonMeiser 2014-05-01 14:16:55

var form = button.closest('form'); 
    var serialize = form.serialize(); 

    if (button.attr('name') !== undefined) { 
     serialize += '&'+button.attr('name')+'='; 
    }

来源

2017-08-18 20:12:39 kjdion84

jQuery的serializeArray不包括被点击的提交按钮

回答

相关问题