jq serializeArray() 方法的介绍与使用
墨初 前端设计 2404阅读
在前台的表单提交中，如果涉及到了批量操作，那么使用 jq 的 serializeArray() 方法，将 form 表单的值通过序列化转换成为一个对象的数组，然后提交给后台，那么在后台就能够很轻松的对数据进行处理。
jq serializeArray() 方法的介绍
serializeArray()：通过序列化表单值来创建对象（name 和 value）的数组。
语法：
$(selector).serializeArray()
返回值：
serializeArray() 方法返回的是 JSON 对象而非 JSON 字符串
注意：
返回的 JSON 对象是由一个对象数组组成的，其中每个对象包含一个名（name 参数）或名与值的对（name 参数和 value 参数
输出的格式：
[
{name: 'name1', value: 'value1'},
{name: 'name2', value: 'value2'},
{name: 'name2'}, // 没有 value 值
]jq serializeArray() 使用方法
示例1：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="https://cdn.staticfile.org/jquery/2.2.4/jquery.min.js" type="text/javascript"></script>
</head>
<body>
<form action="">
<input type="text" name="name" value="小明" />
<input type="text" name="age" value="20" />
<input type="text" name="add" value="上每" />
</form>
<script>
var str = $('form').serializeArray();
console.log(str);
</script>
</body>
</html>控制台输出结果：
[
{name: "name", value: "小明"}
{name: "age", value: "20"}
{name: "add", value: "上每"}
]示例2：
html代码：
<form action=""> <input type="text" name="host" value="http://www.feiniaomy.com" /> <input type="text" name="name" value="飞鸟慕鱼博客" /> <input type="text" name="author" /> </form> <!--js代码与上面的示例相同-->
控制台输出结果：
[
{name: "host", value: "http://www.feiniaomy.com"}
{name: "name", value: "飞鸟慕鱼博客"}
{name: "author", value: ""}
]