首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >jQuery serializeArray不包括所单击的提交按钮

jQuery serializeArray不包括所单击的提交按钮
EN

Stack Overflow用户
提问于 2010-10-24 19:00:43
回答 5查看 42.2K关注 0票数 64

我有一个有两个按钮的表单。一个用于保存记录,另一个用于取消保存过程。我使用的是rails.js (对于那些不了解的人来说,这是一个常见的AJAX/jQuery插件) javascript文件,它与jQuery一起工作,以进行不显眼的javascript/ajax调用。当我通过ajax发送表单数据时,我希望我单击的按钮的名称和值与其余数据一起提交,这样我就可以根据单击的按钮来决定要做什么。

rails.js文件中的方法使用.serializeArray()将表单数据发送到服务器。问题是这不包括我所单击的按钮的名称/值对。jQuery的网站声明他们是故意这样做的(尽管我认为他们应该这样做):

.serializeArray()方法使用successful controls的标准W3C规则来确定它应该包括哪些元素;特别是该元素不能被禁用,并且必须包含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>
EN

回答 5

Stack Overflow用户

回答已采纳

发布于 2010-10-24 19:04:30

有没有其他方法让不在序列化中排除被激活的按钮?

没有,行为基于<form>submit事件,而不是按钮,例如按enter或在JavaScript中调用.submit()。你在这里混合了两个概念,.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
});
票数 73
EN

Stack Overflow用户

发布于 2018-10-26 19:07:48

解决这个问题的很好的方法是:

<form>
    <input type="hidden" name="stuff" value="">
    <button type="submit" onclick="this.form.stuff.value=this.value" value="reset">reset</button>
    <button type="submit" onclick="this.form.stuff.value=this.value" value="delete">delete</button>
</form>
票数 13
EN

Stack Overflow用户

发布于 2012-06-30 13:57:32

我使用下面的代码片段,基本上添加了一个同名的隐藏元素

 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());
 });
票数 8
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/4007942

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档