对于JQuery中的serialize()、serializeArray()、param()方法和map()
来源:互联网 发布:淘宝女装装修图片 编辑:程序博客网 时间:2024/05/18 02:25
对于JQuery中的serialize()、serializeArray()和param()方法
介绍背景: 在我们提交form表单时,如果参数较少,我们可以一项项获取,但当参数很大时,这样的做法就是浪费时间了.
下面介绍的是如何一次获取到所有参数的方法
- serialize()方法
定义和用法
serialize() 方法通过序列化表单值,创建 URL 编码文本字符串。
您可以选择一个或多个表单元素(比如 input 及/或 文本框),或者 form 元素本身。
序列化的值可在生成 AJAX 请求时用于 URL 查询字符串中。
语法:
$(selector).serialize()
示例
<form> <input type="text" name="username" value="zhangsan"> <input type="text" name="age" value="18"> <input type="text" name="job" value="liulang"> <select name="area"> <option value="0">北京</option> <option value="1">上海</option> <option value="2">广州</option> </select> <input type="submit"> </form> <script type="text/javascript"> $('form').submit(function() { var a= $(this).serialize(); console.log(a); //username=zhangsan&age=18&job=liulang&area=1 return false; }); </script>
得到的结果: “name1=value1&name2=value2”
2.serializeArray()方法
定义和用法
serializeArray() 方法通过序列化表单值来创建对象数组(名称和值)。
您可以选择一个或多个表单元素(比如 input 及/或 textarea),或者 form 元素本身。
语法:
$(selector).serializeArray()
示例
<form> <input type="text" name="username" value="zhangsan"> <input type="text" name="age" value="18"> <input type="text" name="job" value="liulang"> <select name="area"> <option value="0">北京</option> <option value="1">上海</option> <option value="2">广州</option> </select> <input type="submit"> </form> <script type="text/javascript"> $('form').submit(function() { var a= $(this).serializeArray(); console.log(a); //[{name: "username", value: "zhangsan"},{name: "age", value: "18"},{name: "job", value: "liulang"},{name: "area", value: "0"}] return false; }); </script>
得到的结果:
[{“name”:”name1”,”value”:”value1”},{“name”:”name2”,”value”:”value2”}]
//将数组转换成json格式,封装serializeJSON = function(id) { var paramJson = {}; var paramArr = $(id).serializeArray(); $(paramArr).each(function(index, obj) { paramJson[obj.name] = obj.value; }); return paramJson;};
用法: serializeJSON (id);
3.param()方法
定义和用法
$.param(obj)可以将serializeArray()生成的结果转化为serialize()的结果形式
序列化的值可在生成 AJAX 请求时用于 URL 查询字符串中。
语法:
$.param(obj);
示例
<form> <input type="text" name="username" value="zhangsan"> <input type="text" name="age" value="18"> <input type="text" name="job" value="liulang"> <select name="area"> <option value="0">北京</option> <option value="1">上海</option> <option value="2">广州</option> </select> <input type="submit"> </form> <script type="text/javascript"> $('form').submit(function() { var a= $(this).serializeArray(); var b = $.param(a); console.log(b); //username=zhangsan&age=18&job=liulang&area=0 return false; }); </script>
得到的结果: “name1=value1&name2=value2”
4.map()方法
定义和用法
map() 把每个元素通过函数传递到当前匹配集合中,生成包含返回值的新的 jQuery 对象。是遍历方式的一种
语法:
$(selector).map(function(index,obj){});
示例
<form> <input type="text" name="username" value="zhangsan"> <input type="text" name="age" value="18"> <input type="text" name="job" value="liulang"> <select name="area"> <option value="0">北京</option> <option value="1">上海</option> <option value="2">广州</option> </select> <input type="submit"> </form> <script type="text/javascript"> $(':input').map(function(index,obj) { console.log(typeof obj); //得到5个 object console.log(obj.value); //得到zhangsan,18,liulang,0,""; console.log(obj.name); //username,age,job,area,""; });
得到的结果: 遍历到多个jQ对象,可以通过属性调用得到属性值
- 对于JQuery中的serialize()、serializeArray()、param()方法和map()
- JQuery中的param()、 serialize() 和serializeArray()方法
- JQuery中serialize()、serializeArray()和param()方法
- JQuery中serialize()、serializeArray()和param()方法
- JQuery中serialize()、serializeArray()和param()方法
- JQuery中serialize()、serializeArray()和param()方法
- JQuery中serialize()、serializeArray()和param()方法
- JQuery中serialize()、serializeArray()和param()方法
- JQuery中serialize()、serializeArray()和param()方法示例介绍
- JQuery中serialize()、serializeArray()和param()方法示例介绍
- JQuery中serialize()、serializeArray()和param()方法示例介绍
- jQuery : serialize 和 serializeArray 方法
- param()、serialize() 和serializeArray()区别
- JQuery中serialize()、serializeArray()和param()方法(转:http://blog.sina.com.cn/s/blog_4f925fc30100la41.html)
- jQuery ajax - serialize()方法和serializeArray() 方法
- jQuery-ajax的serializeArray()、serialize()、param()应用
- jQuery 之serializeArray() 、serialize() 方法
- serializeArray(),serialize(),param()用法
- 如何从宿主机拖动复制文件到虚拟机VM中的解决方法
- undefined reference to `cv::imread(cv::String const&, int)'
- /dev/sdbl has gone 203 days without being checked for check forced
- unity -- 关于文字text和图片image等组件一起居中解决方案
- 个人对kobject的一点研究
- 对于JQuery中的serialize()、serializeArray()、param()方法和map()
- arm交叉编译器gnueabi、none-eabi、arm-eabi、gnueabihf、gnueabi区别
- linux命令——more
- Java中的instanceof运算符的执行原理和使用参考
- 关于JDBC begin failed
- Java中如何将输入的信息写入文本中
- Word2010文档中巧用文本框创建连接
- 【Python编程:从入门到实践】第九章:类
- android开发中单例造成的内存泄漏原因及解决方案