转载http://www.365mini.com/page/jquery-serializearray.htm

描述

  • serializeArray()函数用于序列化一组表单元素,将表单内容编码为一个JavaScript数组。
  • serializeArray()函数常用于将表单内容序列化为JSON对象,以便于被编码为JSON格式的字符串。
  • 该函数会将可用于提交的每个表单控件封装成一个Object对象,该对象有name和value属性,对应该表单控件的name和value属性。然后将这些Object对象封装为一个数组并返回。
  • 该函数不会序列化不需要提交的表单控件,这和常规的表单提交行为是一致的。例如:不在<form>标签内的表单控件不会被提交、没有name属性的表单控件不会被提交、带有disabled属性的表单控件不会被提交、没有被选中的表单控件不会被提交。
  • 与常规表单提交不一样的是:常规表单一般会提交带有name的按钮控件,而serializeArray()函数不会序列化带有name的按钮控件。
  • 该函数属于jQuery对象(实例)。

语法

  • jQuery 1.2 新增该函数。
  • jQueryObject.serializeArray( )
  • 返回值:serializeArray()函数的返回值为Array类型,返回将表单元素编码后的JS数组。

示例&说明

请参考下面这段初始HTML代码:

<form name="myForm" action="http://www.365mini.com" method="post"><input name="uid" type="hidden" value="1" /><input name="username" type="text" value="张三" /><input name="password" type="text" value="123456" /><select name="grade" id="grade"><option value="1">一年级</option><option value="2">二年级</option><option value="3" selected="selected">三年级</option><option value="4">四年级</option><option value="5">五年级</option><option value="6">六年级</option></select><input name="sex" type="radio" checked="checked" value="1" />男<input name="sex" type="radio" value="0" />女<input name="hobby" type="checkbox" checked="checked" value="1" />游泳<input name="hobby" type="checkbox" checked="checked" value="2" />跑步<input name="hobby" type="checkbox" value="3" />羽毛球<input name="btn" id="btn" type="button" value="点击" />
</form>

对<form>元素进行序列化可以直接序列化其内部的所有表单元素。

var formArray = $("form").serializeArray();
/* 以下是序列化后的结果数组formArray的内容:
[{ name: "uid", value: "1" },{ name: "username", value: "张三" },{ name: "password", value: "123456" },{ name: "grade", value: "3" },{ name: "sex", value: "1" },{ name: "hobby", value: "1" },{ name: "hobby", value: "2" }
];
*/

我们也可以直接对部分表单元素进行序列化。

var result = $(":text, select, :checkbox").serializeArray();
/* 以下是序列化后的结果数组result的内容:
[ { name: "username", value: "张三" }, { name: "password", value: "123456" },{ name: "grade", value: "3" },{ name: "hobby", value: "1" },{ name: "hobby", value: "2" }
];
*/

jQuery.serializeArray() 函数详解相关推荐

  1. [zz]jQuery.extend 函数详解

    JQuery的extend扩展方法:       Jquery的扩展方法extend是我们在写插件的过程中常用的方法,该方法有一些重载原型,在此,我们一起去了解了解.       一.Jquery的扩 ...

  2. jQuery.parseJSON()函数详解

    jQuery.parseJSON()函数用于将格式完好的JSON字符串转为与之对应的JavaScript对象. 所谓"格式完好",就是要求指定的字符串必须符合严格的JSON格式,例 ...

  3. js $.ajax stop,jQuery.ajaxStop() 函数详解

    ajaxStop()函数用于为AJAX请求的ajaxStop事件绑定处理函数. 这是一个全局AJAX事件函数,用于在ajaxStop事件被触发时执行绑定的事件处理函数. jQuery官方文档描述:无论 ...

  4. jquery.ajaxSetup()函数详解

    jquery.ajaxSetup() 函数用于设置全局默认设置.jquery1.1新增 该静态函数 语法:  jquery.ajaxSetup(settings) 参数(settings):一个对象, ...

  5. jQuery.inArray() 函数详解

    jQuery.inArray()函数用于在数组中搜索指定的值,并返回其索引值.如果数组中不存在该值,则返回 -1. 该函数属于全局jQuery对象. 语法 jQuery 1.2 新增该静态函数. jQ ...

  6. jQuery.parseJSON() 函数详解

    由于偶然用到了javascript中JSON.parse和JSON.stringify,所以就查了一下jquery中有关这方面的知识,jQuery.parseJSON()这个用法,怎么用,我总结一下, ...

  7. jQuery.delegate() 函数详解

    delegate()函数用于为指定元素的一个或多个事件绑定事件处理函数. 此外,你还可以额外传递给事件处理函数一些所需的数据. 即使是执行delegate()函数之后新添加的元素,只要它符合条件,绑定 ...

  8. jQuery.extend 函数详解

    JQuery的extend扩展方法: Jquery的扩展方法extend是我们在写插件的过程中常用的方法,该方法有一些重载原型,在此,我们一起去了解了解. 一.Jquery的扩展方法原型 extend ...

  9. jQuery.ready() 函数详解

    ready()函数用于在当前文档结构载入完毕后立即执行指定的函数. 该函数的作用相当于window.onload事件. 你可以多次调用该函数,从而绑定多个函数,jQuery将在DOM文档结构加载完毕后 ...

最新文章

  1. Java扫描注解下的包_使用Spring mvc 利用java的反射技术,来扫描对应包下的注解请求url 统一保存在数据库中...
  2. auto_ptr动态分配对象
  3. 网站推广——网站推广专员浅析企业网站验收和交付要注意哪些问题
  4. 项目总结--基于Cortex-A9平台的米兰花智能培育系统
  5. GDCM:gdcm::Dict的测试程序
  6. java基础学习(一)hashcode
  7. SpringCloud Ribbon(五)之服务实例列表ServerList
  8. 如何让HTML在手机上实现直接拨打电话以及发送短信?
  9. php pdo mysql 预处理_PHP PDO mysql 处理类(prepare 预处理)
  10. [Python+sklearn] 计算混淆矩阵 confusion_matrix()函数
  11. sublime text3 主题-Boxy Theme
  12. hdu1166敌兵布(线段树模板题)
  13. java实现清除图片水印_Java实现图片水印
  14. Python之条件竞争
  15. 加州大学欧文分校计算机排名,2017年加州大学欧文分校在美国的排名是多少?...
  16. Linux常用命令-权限管理命令
  17. 并发编程(一)多线程基础和原理
  18. 你见过最奇葩的代码提交信息是什么?别再为写commit message头疼了!
  19. 2-linux详细安装Redis及shutdown命令失效解决
  20. java mail 学习笔记

热门文章

  1. window40系统怎么重装不下服务器,Win10系统异常不想重装怎么办 四种系统修复方法哪种比较好...
  2. pgsql的with 用法及case函数
  3. 计算机考研400分能上清华吗,考研400分能上清华吗 400分是什么水平
  4. android webview 内存溢出,Android 内存溢出和内存泄漏的问题
  5. 监听浏览器窗口关闭事件onbeforeunload不起作用
  6. 纯CSS绘制圣诞老人头像
  7. 小程序关于ios与安卓时间转换问题
  8. GRB非隔离系列宽电压输入负高电压输出 电压控制型
  9. 实现倒计时 JavaScript(定时器 setInterval)
  10. 玩了下体像素软件MagicaVoxel