表单内的 jQuery Textarea 选择器答案

【问题标题】：jQuery Textarea Selector Inside Form表单内的 jQuery Textarea 选择器
【发布时间】：2013-11-14 23:26:45
【问题描述】：

我有以下代码：

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv='Content-Type' content='text/html;charset=utf-8' />

    <script type='text/javascript' src='jquery-1.10.2.min.js'></script>
</head>
<body>
    <form id="testForm" method="post" action="">
        <textarea id="test" rows="15" cols="60"></textarea>
    </form>
    <button type="button" onclick="console.log($('#testForm :input').serializeArray());">Send</button>
</body>
</html>

Chrome 控制台正在打印一个空数组，就像 #testForm :input 选择器没有选择 textarea 一样。我正在寻找一种选择所有表单输入的方法，这适用于除 textarea 之外的其他元素。我该如何解决？是否需要 serialize*Array* 或者我可以只使用 serialize 方法将数据发送到服务器？

【问题讨论】：

标签： javascript jquery forms jquery-selectors textarea

【解决方案1】：

.serializeArray() 使用输入元素的名称进行序列化，因为您的元素没有名称，所以将其省略。

.serializeArray() 方法使用标准 W3C 规则成功的控制以确定它应该包括哪些元素；在特别是该元素不能被禁用，并且必须包含一个名称属性。

<textarea name="test" id="test" rows="15" cols="60"></textarea>

演示：Fiddle

【讨论】：

【解决方案2】：

要使serializeArray() 方法工作（并且您的HTML 有效），您需要为textarea 提供name 属性：

<form id="testForm" method="post" action="">
    <textarea id="test" rows="15" cols="60" name="foo"></textarea>
</form>
<button type="button" onclick="console.log($('#testForm :input').serializeArray());">Send</button>

Example fiddle

【讨论】：

@jumpa 没问题，很高兴为您提供帮助

【解决方案3】：

.serializeArray() 需要 name 属性来创建一个数组，所以插入 name 选项

<textarea name="test" id="test" rows="17" cols="65"></textarea>

【讨论】：