一、param() 方法创建数组或对象的序列化表示。

　　该序列化值可在进行 AJAX 请求时在 URL 查询字符串中使用。

语法：

　　jQuery.param(object,traditional)
　　object要进行序列化的数组或对象
　　traditional规定是否使用传统的方式浅层进行序列化（参数序列化）。

　　$.ajax()设置 的 traditional参数实际上是设置 jQuery.param 的traditional 参数，默认为false，当设置为true后，会导致多层次的对象序列化为[object object]（浅序列化）

  1. <html>
  2. <head>
  3. <script type="text/javascript" src="jquery-1.8.3.min.js"></script>
  4. <script type="text/javascript">
  5. $(document).ready(function(){
  6.     personObj=new Object();
  7.     personObj.firstname="Bill";
  8.     personObj.lastname="Gates";
  9.     personObj.age=;
  10.     personObj.eyecolor="blue";
  11.     $("button").click(function(){
  12.         $("div").text($.param(personObj));
  13.     });
  14. });
  15. </script>
  16. </head>
  17. <body>
  18. <button>序列化对象</button>
  19. <div></div>
  20. </body>
  21. </html>
  22. //输出结果：firstname=Bill&lastname=Gates&age=60&eyecolor=blue

二、serialize() 方法通过序列化表单值，创建 URL 编码文本字符串

　　您可以选择一个或多个表单元素（比如 input 或 文本框），或者 form 元素本身。

　　序列化的值可在生成 AJAX 请求时用于 URL 查询字符串中。

　　.serialize() 方法创建以标准 URL 编码表示的文本字符串。它的操作对象是代表表单元素集合的 jQuery 对象。

　　.serialize() 方法可以操作已选取个别表单元素的 jQuery 对象，比如 <input>, <textarea> 以及 <select>。不过，选择 <form> 标签本身进行序列化一般更容易些。

　　注意：1、只会将“成功的控件”序列化为字符串。（即不能被禁用）

　　　      2、如果不使用按钮来提交表单，则不对提交按钮的值序列化。

　　　　　3、如果要表单元素的值包含到序列字符串中，元素必须使用 name 属性。

  1. <html>
  2. <head>
  3. <script type="text/javascript" src="jquery-1.8.3.min.js"></script>
  4. <script type="text/javascript">
  5. $(document).ready(function(){
  6.     $("button").click(function(){
  7.         $("div").text($("form").serialize());
  8.     });
  9. });
  10. </script>
  11. </head>
  12. <body>
  13. <form action="">
  14. First name: <input type="text" name="FirstName" value="Bill" /><br />
  15. Last name: <input type="text" name="LastName" value="Gates" /><br />
  16. </form>
  17.  
  18. <button>序列化表单值</button>
  19. <div></div>
  20. </body>
  21. </html>

三、serializeArray() 方法通过序列化表单值来创建对象数组（名称和值）。

　　您可以选择一个或多个表单元素（比如 input 或 textarea），或者 form 元素本身。

　　语法：$(selector).serializeArray()

详细说明：

　　serializeArray() 方法序列化表单元素（类似 .serialize() 方法），返回 JSON 数据结构数据。

　　注意：此方法返回的是 JSON 对象而非 JSON 字符串。需要使用插件或者第三方库进行字符串化操作。

　　返回的 JSON 对象是由一个对象数组组成的，其中每个对象包含一个或两个名值对 —— name 参数和 value 参数（如果 value 不为空的话）。举例来说：

  1. [
  2.   {name: 'firstname', value: 'Hello'},
  3.   {name: 'lastname', value: 'World'},
  4.   {name: 'alias'}, // 值为空
  5. ]

　　.serializeArray() 方法使用了 W3C 关于 successful controls（有效控件） 的标准来检测哪些元素应当包括在内。特别说明：元素不能被禁用（禁用的元素不会被包括在内），并且元素应当有含有 name 属性。提交按钮的值也不会被序列化。文件选择元素的数据也不会被序列化。

　　该方法可以对已选择单独表单元素的对象进行操作，比如 <input>, <textarea>, 和 <select>。不过，更方便的方法是，直接选择 <form> 标签自身来进行序列化操作。

  1. $("form").submit(function() {
  2.     console.log($(this).serializeArray());
  3.     return false;
  4. });
  5.  
  6. //上面的代码产生下面的数据结构（假设浏览器支持 console.log）：
  7. [
  8.   {
  9.     name: a
  10.     value:
  11.   },
  12.   {
  13.     name: b
  14.     value:
  15.   },
  16.   {
  17.     name: c
  18.     value:
  19.   },
  20.   {
  21.     name: d
  22.     value:
  23.   },
  24.   {
  25.     name: e
  26.     value:
  27.   }
  28. ]

总结：

1、param()，数组或对象序列化表示

2、serialize()，序列化表单（成功元素、必须有name属性）

3、serializeArray()，序列化表单来创建对象数组，返回JSON对象

jQuery对象的序列化详解的更多相关文章

  1. jquery对象中 “冒号” 详解

      冒号  可以理解为 “匹配” 或 “选取”的意思.   $(":button") 表示匹配所有的按钮.$("input:checked")表示匹配所有选中的 ...

  2. Jquery遍历筛选数组的几种方法和遍历解析json对象|Map()方法详解

    Jquery遍历筛选数组的几种方法和遍历解析json对象|Map()方法详解 一.Jquery遍历筛选数组 1.jquery grep()筛选遍历数组 $().ready( function(){ v ...

  3. 触碰jQuery：AJAX异步详解

    触碰jQuery:AJAX异步详解 传送门:异步编程系列目录…… 示例源码:触碰jQuery:AJAX异步详解.rar AJAX 全称 Asynchronous JavaScript and XML( ...

  4. jQuery调用AJAX异步详解[转]

    AJAX 全称 Asynchronous JavaScript and XML(异步的 JavaScript 和 XML).它并非一种新的技术,而是以下几种原有技术的结合体. 1)   使用CSS和X ...

  5. 触碰jQuery：AJAX异步详解（转）

    AJAX 全称 Asynchronous JavaScript and XML(异步的 JavaScript 和 XML).它并非一种新的技术,而是以下几种原有技术的结合体. 1)   使用CSS和X ...

  6. jQuery form插件使用详解

    点击打开: jquery选择器全解 jquery中的style样式操作 jquery中的DOM操作 jquery中的事件操作全解 jquery中的动画操作全解 jquery中ajax的应用 自定义jq ...

  7. jQuery插件制作方法详解

        jQuery插件制作方法详解   jquery插件给我的感觉清一色的清洁,简单.如Jtip,要使用它的功能,只需要在你的元素的class上加 上Jtip,并引入jtip.js及其样式即可以了. ...

  8. jQuery Event.which 属性详解

    jQuery Event.which 属性详解 which属性用于返回触发当前事件时按下的键盘按键或鼠标按钮. 对于键盘和鼠标事件,该属性用于确定你按下的是哪一个键盘按键或鼠标按钮. which属性对 ...

  9. jQuery Validate验证框架详解

    转自:http://www.cnblogs.com/linjiqin/p/3431835.html jQuery校验官网地址:http://bassistance.de/jquery-plugins/ ...

随机推荐

  1. python标准库之【socket】

    socket通常也称作”套接字“.网络上的两个程序通过一个双向的通信连接实现数据的交换,这个连接的一端称为一个socket.socket 是网络连接端点.例如当你的Web浏览器请求www.fishc. ...

  2. 把web项目部署到tomcat上

    首先在服务器搭建JDK环境:https://www.cnblogs.com/lb809663396/p/5855877.html 然后把tomcat文件包复制到服务器上,访问http://localh ...

  3. centos7.5英文环境切换到中文环境，再切回中文环境后 ，terminal不能用

    1.查看系统日志 less /var/logs/message May 12 21:54:41 localhost python: SELinux is preventing /usr/libexec ...

  4. 三：Ionic Framework开发Android应用

    第一步:添加Android平台 ionic cordova platform add android 第二步:编译Android应用 中间等待的过程有点长,需要耐心等待,生成的apk此时可以复制至平板 ...

  5. python request post上传文件额外注意点

    通用用法 但上图的字段名,类型需要根据不同接口填写,如某服务接口: 因而对应的上传代码如下: # 输出参数:请求响应报文import requestsrequest_url = 'https://XX ...

  6. Java-多线程编程（一）

    创建多线程 [Thread class]1.继承Thread类,重写run() [Runnable接口]2.实现Runnable接口,重写run() [*Callable接口]3.实现Callable ...

  7. Telnet操作memcached

    telnet登录 #telnet <ip> [root@c1 ~]# telnet Trying 127.0.0.1... Connected to 127.0.0.1. Escape c ...

  8. BZOJ 2527 [Poi2011]Meteors（整体二分）

    [题目链接] http://www.lydsy.com/JudgeOnline/problem.php?id=2527 [题目大意] 有N个成员国.现在它发现了一颗新的星球, 这颗星球的轨道被分为M份 ...

  9. 【树形dp】Codeforces Round #405 (rated, Div. 1, based on VK Cup 2017 Round 1) B. Bear and Tree Jumps

    我们要统计的答案是sigma([L/K]),L为路径的长度,中括号表示上取整. [L/K]化简一下就是(L+f(L,K))/K,f(L,K)表示长度为L的路径要想达到K的整数倍,还要加上多少. 于是, ...

  10. 【左偏树+延迟标记+拓扑排序】BZOJ4003-城池攻占

    [题目大意] 有n个城市构成一棵树,除1号城市外每个城市均有防御值h和战斗变化参量a和v. 现在有m个骑士各自来刷副本,每个其实有一个战斗力s和起始位置c.如果一个骑士的战斗力s大于当前城市的防御值h ...