blocks|key|296023|text|type|unstyled|depth|inlineStyleRanges|entityRanges|data|296024|有没有其他方法让不在序列化中排除被激活的按钮？|blockquote|offset|length|style|BOLD|296025|296026|296027|没有，行为基于<form>的submit事件，而不是按钮，例如按enter或在JavaScript中调用.submit()。你在这里混合了两个概念，.serialize()或.serializeArray()可能与按钮点击有任何关系，也可能没有任何关系-这只是一个完全独立的事件，它们并没有联系在一起。这些方法处于更高的级别:您可以出于任何原因在任何时间序列化窗体(或窗体的子集)。|CODE|296028|但是，您可以添加提交名称/值对，就像从该按钮提交的普通表单一样，如果您从按钮提交，例如：|296029|$("#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
});|code-block|syntax|javascript|296030|entityMap|0|LINK|mutability|MUTABLE|url|https://developer.mozilla.org/en/DOM/form.submit|1|http://api.jquery.com/serialize/|2|http://api.jquery.com/serializeArray/^0|0|8|6|0|0|0|7|6|E|6|1G|9|22|C|2F|H|1G|9|0|22|C|1|2F|H|2|0|0|0^^$0|@$1|2|3|-4|4|5|6|15|7|@]|8|@]|9|$]]|$1|A|3|B|4|C|6|16|7|@$D|17|E|18|F|G]]|8|@]|9|$]]|$1|H|3|-4|4|5|6|19|7|@]|8|@]|9|$]]|$1|I|3|-4|4|5|6|1A|7|@]|8|@]|9|$]]|$1|J|3|K|4|5|6|1B|7|@$D|1C|E|1D|F|L]|$D|1E|E|1F|F|L]|$D|1G|E|1H|F|L]|$D|1I|E|1J|F|L]|$D|1K|E|1L|F|L]]|8|@$D|1M|E|1N|1|1O]|$D|1P|E|1Q|1|1R]|$D|1S|E|1T|1|1U]]|9|$]]|$1|M|3|N|4|5|6|1V|7|@]|8|@]|9|$]]|$1|O|3|P|4|Q|6|1W|7|@]|8|@]|9|$R|S]]|$1|T|3|-4|4|5|6|1X|7|@]|8|@]|9|$]]]|U|$V|$4|W|X|Y|9|$Z|10]]|11|$4|W|X|Y|9|$Z|12]]|13|$4|W|X|Y|9|$Z|14]]]]

<blockquote>
<p>Is [there] another method that <strong>DOESN'T</strong> exclude the activated button in a serialization?</p>
</blockquote>
<p>There is not, the behavior is based on the <code>submit</code> event <em>of the</em> <code>&lt;form&gt;</code>, not <em>of a button</em>, e.g. hitting enter or calling <a href="https://developer.mozilla.org/en/DOM/form.submit" rel="nofollow noreferrer"><code>.submit()</code></a> in JavaScript.  You're mixing 2 concepts here, a <a href="http://api.jquery.com/serialize/" rel="nofollow noreferrer"><code>.serialize()</code></a> or <a href="http://api.jquery.com/serializeArray/" rel="nofollow noreferrer"><code>.serializeArray()</code></a> may or may not have <em>anything</em> to do with a button click - it's just a separate event altogether, they're not connected.  These methods are at a higher level than that: you can serialize a form (or a subset of it) at any time for any reason.</p>
<p>You can however add the submit name/value pair like a normal form submitting from that button would, if you're submitting from a button for example:</p>
<pre><code>$(&quot;#mySubmit&quot;).click(function() {
  var formData = $(this).closest('form').serializeArray();
  formData.push({ name: this.name, value: this.value });
  //now use formData, it includes the submit button
});
</code></pre>


blocks|key|3229238|text|我使用下面的代码片段，基本上添加了一个同名的隐藏元素|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3229239|+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());
+});|code-block|syntax|javascript|3229240|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>I use the following snippet, basically adds a hidden element with same name</p>

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

 $(form).submit(function(){
     console.log($(this).serializeArray());
 });
</code></pre>


blocks|key|293301|text|这个解决方案是“通用的”，因为它将处理所有提交的输入，在提交时将每个输入作为表单变量传递。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|293302|$(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()+});
++++++++});
++++});
});|code-block|syntax|javascript|293303|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>This solution is 'universal' as in it will handle all your input submits, passing each as a form variable on submission.</p>

<pre><code>$(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() });
        });
    });
});
</code></pre>


blocks|key|290976|text|++++var+form+=+button.closest('form');
++++var+serialize+=+form.serialize();

++++if+(button.attr('name')+!==+undefined)+{
++++++++serialize+%2B=+'&'%2Bbutton.attr('name')%2B'=';
++++}|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|290977|unstyled|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|G|8|@]|9|@]|A|$B|C]]|$1|D|3|-4|5|E|7|H|8|@]|9|@]|A|$]]]|F|$]]

<pre><code>    var form = button.closest('form');
    var serialize = form.serialize();

    if (button.attr('name') !== undefined) {
        serialize += '&amp;'+button.attr('name')+'=';
    }
</code></pre>


blocks|key|293308|text|解决这个问题的很好的方法是：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|293309|<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>|code-block|syntax|javascript|293310|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>fairly neat way to solve this:</p>

<pre><code>&lt;form&gt;
    &lt;input type="hidden" name="stuff" value=""&gt;
    &lt;button type="submit" onclick="this.form.stuff.value=this.value" value="reset"&gt;reset&lt;/button&gt;
    &lt;button type="submit" onclick="this.form.stuff.value=this.value" value="delete"&gt;delete&lt;/button&gt;
&lt;/form&gt;
</code></pre>


<p>I have a form that has two buttons. One for saving a record and the other for cancelling the save procedure. I am using the <code>rails.js</code> <em>(a common AJAX/jQuery plug-in for those of you not in the know)</em>  javascript file that works with jQuery for unobtrusive javascript/ajax calls. When I send the form data over ajax, I want the name and value of the button I clicked to be submitted with the rest of the data so that I can make a decision on what to do based on which button was clicked.</p>

<p>The method in the <code>rails.js</code> file uses <code>.serializeArray()</code> for sending form data to the server. The problem is that this doesn't include the name/value pair of the button I've clicked. jQuery's website states that they do this on purpose (eventhough its my opinion that they should):</p>

<p>"The <code>.serializeArray()</code> method uses the standard W3C rules for <a href="http://www.w3.org/TR/html401/interact/forms.html#h-17.13.2" rel="noreferrer">successful controls</a> to determine which elements it should include; in particular the element cannot be disabled and must contain a name attribute. No submit button value is serialized since the form was not submitted using a button."</p>

<p>How can they assume that a form WASN'T submitted using a button? This makes no sense and a wrong assumption I believe.</p>

<p>Under the W3C rules the button which was activated for the submission of a form is considered a <strong>successful control</strong>.</p>

<p>Since the developers of jQuery have decided to do this on purpose, can I assume that there is another method that <strong>DOESN'T</strong> exclude the activated button in a serialization?</p>

<p><strong>EDIT: Here is quick example of what my form might look like...</strong></p>

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


jQuery serializeArray doesn't include the submit button that was clicked

服务器

jQuery

我有一个有两个按钮的表单。一个用于保存记录，另一个用于取消保存过程。我使用的是rails.js (对于那些不了解的人来说，这是一个常见的AJAX/jQuery插件) javascript文件，它与jQuery一起工作，以进行不显眼的javascript/ajax调用。当我通过ajax发送表单数据时，我希望我单击的按钮的...

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

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

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

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

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