Question

考虑以下形式：

<form id="form" name="form">
<input name="name"/>
<input name="version"/>
<input name="template"/>
<textarea name="elements"></textarea>
<textarea name="features"></textarea>
<textarea name="layout"></textarea>
<input type="submit" value="Save"/>
</form>

和javascript（使用jQuery 1.3.2）：

$(function() {
    $('#form').bind('submit',function() { alert($('#form').serialize()); return false; });
    });

从上述javascript警报提交上述表单的输出是：

elements=...

其中......是元素字段中包含的内容。

我希望$（'＃form'）。serialize（）返回一个类似的字符串：

name=&version=&template=&elements=&features=&layout=.

我注意到$（'input，textarea'）。serialize（）确实执行预期的行为（即返回“name =＆amp; version =＆amp; template =＆amp; elements = asdafe＆amp; ; features =＆amp; layout =“），但我很好奇为什么$（'#form'）版本只返回”elements =“。

我在Safari 4和Firefox 3.5上试过这个，所以我很有信心这是我所缺少的。

感谢阅读。

Answer 1

这是你的textarea的名字，它正在抛弃它。

以下是它如何分解。在DOM中，form个节点有几个特殊属性，最明显的是这两个（按此顺序公开）

elements个集合，它是所有表单控件的HTMLCollection（以及其他一些节点，如<fieldset>元素）
表单中每个命名元素的属性（即具有name属性的表单控件）

由于您的<textarea>名称为“elements”，因此会有效地覆盖上面＃1中提到的内置elements集合，这就是为什么在序列化表单时，您看到的只是

elements=****

因为单个表单元素已覆盖整个集合。

简短的解决方案？将表单元素重命名为不是现有DOM属性的值（您的<input name="name"/>也属于此类别）

Answer 2

如果其他人偶然发现此问题，我在调用disabled之前已在所有输入上设置serialize()属性，因此它们未包含在集合中。在调用disabled之前删除serialize()会修复此问题。

Answer 3

.serializeArray()方法创建一个JavaScript对象数组，可以编码为JSON字符串。它在表示一组表单元素的jQuery对象上运行。表单元素可以有几种类型：

jQuery $（'form'）。serialize（）只返回序列化表单的一个元素

3 个答案: