jQeury提供了2个帮助获取表单元素数据的方法。分别是serialize() 和 serializeArray()。两者作用完全相同,只不过是返回值不同,前者是返回一个字符串,后者返回一个Json对象数组。直接看例子,一目了然。
1.表单结构代码
<form id="form1"> ???<input type="text" name="uName" ?value="老王"> ???<input type="password" name="pwd" ?value="123456"> ???<input type="text" name="phone" value="13555558888"> ???<input type="submit" id="btn" value="提交数据"></form>
2.js代码
//引入必要的jquery依赖js 上面已经说过jquery中包含完整的ajax<script src="/static/jquery1.12.min.js"></script><script> ???$(document).ready(function () { ???????//点击提交按钮 打印两种序列化方式出来的字符串 ???????$("#btn").click(function () { ???????????//打印字符串序列化表单 ???????????console.log($("#form1").serialize()); ???????????//打印json数据格式序列化表单 ???????????console.log($("#form1").serializeArray()) ???????}) </script>
3.输出结果
jQuery会自动搜索到form1中的所有表单元素,然后获取到对应的value值。这里需要注意的是,所有的表单元素在获取时,是以name属性为准的,不是以id属性为准。
serialize()的输出结果是:uName=老王&pwd=123456&phone=13555558888。
serializeArray()的输出结果是:[{"uName" : "老王"}, {"pwd" : "123"}, {"phone" : "13555558888"}]
jQuery 之 serialize() serializeArray()
原文地址:https://www.cnblogs.com/ldq678/p/9736157.html