jquery-读取form表单中的所有数据列表

最新推荐文章于 2022-08-15 17:58:05 发布

转载最新推荐文章于 2022-08-15 17:58:05 发布 · 143 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/hwaggLee/p/5877110.html

文章标签：

#javascript #json #ViewUI

本文介绍了一种使用jQuery库来序列化HTML表单数据的方法。通过将表单元素转换为JSON格式，可以轻松地将数据发送到服务器进行处理。文章详细解释了如何使用$('form').serializeArray()方法收集表单字段，并将其转换为对象，最后通过alert展示序列化后的JSON字符串。

代码：

<script>
$(function() {
  $('#submit').click(function() {
    var d = {};
    var t = $('form').serializeArray();
    $.each(t, function() {
      d[this.name] = this.value;
    });
    alert(JSON.stringify(d));
  });
});
</script>
<form>
<input id="a1" type="input" value="" name="a1"><br>
<input id="a2" type="input" value="" name="a2"><br>
<input id="a3" type="input" value="" name="a3"><br>
<input id="a4" type="input" value="" name="a4"><br>
<select id="ax" name="ax">
<option value="0">选项1</option>
<option value="1">选项2</option>
</select><br>
<input id="submit" type="button" value="提交" name="submit">
</form>