如何使用 JavaScript/jQuery 检索表单数据？

使用 JavaScript/jQuery 检索表单数据

表单提交通常需要检索表单数据以在客户端进行验证或处理。该数据包括输入字段、选择列表和其他元素。一个常见的问题是如何以简化的方式获取这些数据。

使用 jQuery 的 serializeArray() 方法

一种优雅的解决方案是利用 jQuery() 方法，它返回表示表单数据的对象数组。此方法有效地将表单序列化为键值对数组：

$(function () {
    var formData = $('#form').serializeArray();
});

例如，如果您的表单包含以下字段：

<input type="radio" name="foo" value="1" checked="checked" />
<input type="radio" name="foo" value="0" />
<input name="bar" value="xxx" />
<select name="this">
    <option value="hi" selected="selected">Hi</option>
    <option value="ho">Ho</option>
</select>

输出将为：

[
  {"name":"foo","value":"1"},
  {"name":"bar","value":"xxx"},
  {"name":"this","value":"hi"}
]

使用 jQuery 的 serialize()方法

或者，您可以使用 jQuery() 创建表单数据的查询字符串表示形式：

$(function () {
    var formData = $('#form').serialize();
});

此方法输出一个包含分隔的键值对的字符串由 & 符号组成，适合提交给服务器：

"foo=1&bar=xxx&this=hi"

演示

查看在此 JSFiddle 中使用两种 jQuery 方法检索表单数据的实际演示：https://jsfiddle.net/t7hvjne1/

以上是如何使用 JavaScript/jQuery 检索表单数据？的详细内容。更多信息请关注PHP中文网其他相关文章！