jquery serializeArray() 方法通过序列化表单值来创建对象数组(名称和值)。
serializeArray() 方法序列化表单元素(类似 .serialize() 方法),返回 JSON 数据结构数据。
html代码:
<form>
<div><input type="text" name="a" value="1" id="a" /></div>
<div><input type="text" name="b" value="2" id="b" /></div>
<div><input type="hidden" name="c" value="3" id="c" /></div>
<div>
<textarea name="d" rows="8" cols="40">4</textarea>
</div>
<div><select name="e">
<option value="5" selected="selected">5</option>
<option value="6">6</option>
<option value="7">7</option>
</select></div>
<div>
<input type="checkbox" name="f" value="8" id="f" />
</div>
<div>
<input type="submit" name="g" value="Submit" id="g" />
</div>
</form>
jquery代码:
$('form').submit(function() {
  console.log($(this).serializeArray());
  return false;
});
将产生以下数据结构(浏览器提供的console.log):
[
{
name: "a",
value: "1"
},
{
name: "b",
value: "2"
},
{
name: "c",
value: "3"
},
{
name: "d",
value: "4"
},
{
name: "e",
value: "5"
}
]
实际应用例子,通过ajax把表单数据上传给服务器:
var formdataArr = $(form).serializeArray();
var formdata = {};
for (var i = 0; i < formdataArr.length; i++) {
if(formdataArr[i]['name'] == "editorValue"){
continue;
} formdata[formdataArr[i]['name']] = formdataArr[i]['value'];
};
$.ajax({
url: '/cases/submit',
type: 'post',
dataType: 'json',
data: formdata,
success: function(data){ if(data.r == "0"){
bootbox.alert({
message: data.msg || "恭喜,提交保存成功",
callback: function() {
document.location.href = "/cases/showCaseList";
}
});
return false;
}else{
bootbox.alert(data.msg || "抱歉,提交保存失败");
return false;
}
},
error: function(){
bootbox.alert("抱歉,网络繁忙,请稍后再试");
}
});
jquery serializeArray() 方法通过序列化表单值来创建对象数组(名称和值)。的更多相关文章
- jquery serialize()方法可以序列化表单值为字符串
		
<form> <div><input type="text" name="a" value="1" id=&q ...
 - jQuery ajax - serialize() 方法-输出序列化表单值
		
定义和用法 serialize() 方法通过序列化表单值,创建 URL 编码文本字符串. 您可以选择一个或多个表单元素(比如 input 及/或 文本框),或者 form 元素本身. 序列化的值可在生 ...
 - 用jquery可以用使用serialize()序列化表单值,那有没有什么方法可以将值填充到表单中呢? (一段不错的代码)
		
serialize()的作用,是生成一个类似这种格式的字符串用于ajax提交 a=&b=&c=.你想将值填写到表单,首先要有值,然后就是表单控件的id或者能唯一定位控件的属性.然后就$ ...
 - jQuery  serializeArray()方法改写多维对象以及自定义
		
jQuery客户端表单数据获取 jq在进行客户端表单数据获取我们通常用serialize或者是serizlizeArray(),两种方法,可是在serizlizeArray()返回的数据是一个数组,数 ...
 - jquery中使用serialize() 序列化表单时 中文乱码问题
		
序列化中文时之所以乱码是因为.serialize()调用了encodeURLComponent方法将数据编码了 解决方法就是进行解码 1 原因:.serialize()自动调用了encodeURICo ...
 - JQuery补充——获取与设置表单值
		
//写jQuery代码时注意前面一定要记得加$(function(){});,在文档加载完成后进行代码的编写 使用jQuery的表单对象属性来选择被选中的项::checked,详见文档选择器部分 根据 ...
 - (笔记)JQuery扩展方法实现Form表单与Json互相转换
		
JQuery笔记 记两段代码,使用JQuery实现从表单获取json与后端交互,以及把后端返回的json映射到表单相应的字段上. 把表单转换出json对象 //把表单转换出json对象 $.fn.to ...
 - JQuery扩展方法实现Form表单与Json互相转换
		
1.把表单转换出json对象 //把表单转换出json对象 $.fn.toJson = function () { var self = this, json = {}, push_counters ...
 - jQuery序列化表单数据 serialize()、serializeArray()及使用
		
1.serialize() 方法: serialize() 方法通过序列化表单值,创建 URL 编码文本字符串. 您可以选择一个或多个表单元素(比如 input 及/或 文本框),或者 form 元素 ...
 
随机推荐
- PowerBI  应用时间智能(生成日期表)
			
简介 Power BI Desktop -是一款由微软发布的自助式商业智能工具,功能强大.易于使用.其中还可以通过微软云连多个数据源并且使用数据源来创建可视化表盘. 但是几乎所有的BI都需要展示如何随 ...
 - JDO
			
JDO 编辑 本词条缺少名片图,补充相关内容使词条更完整,还能快速升级,赶紧来编辑吧! JDO(Java Data Object )是Java对象持久化的新的规范,也是一个用于存取某种数据仓库中的对象 ...
 - liunx中安装软件的几种方式
			
服务器安装包一般有四种方式 1.源代码包安装 自由度高 需要预编译,安装速度慢 2.rpm包手动安装 安装的缺点是文件的关联性太大 3. 二进制tar.gz格式 直接解压即可 如tomca ...
 - Linux之vi(vim)编辑器
			
命令行模式:默认进来就是命令行模式 ,可以使用很多命令:比如i . a . o i:光标前面输入内容 a:光标的下一位字符开始输入内容 o:光标的下一行开始输入内容 编辑模式: 退出编辑模式:键盘上e ...
 - k近邻法(kNN)
			
<统计学习方法>(第二版)第3章 3 分类问题中的k近邻法 k近邻法不具有显式的学习过程. 3.1 算法(k近邻法) 根据给定的距离度量,在训练集\(T\)中找出与\(x\)最邻近的\(k ...
 - mybatis 实现批量更新
			
更新单条记录 1 UPDATE course SET name = 'course1' WHERE id = 'id1'; 更新多条记录的同一个字段为同一个值 1 UPDATE course SET ...
 - Hibernate-02 HQL实用技术
			
学习任务 Query接口的使用 HQL基本用法 动态参数绑定查询 HQL的使用 Hibernate支持三种查询方式:HQL查询.Criateria查询.Native SQL查询. HQL是Hibern ...
 - Centos 7 编译nginx 1.14.0
			
步骤一:下载nginx安装包 wget https://nginx.org/download/nginx-1.14.0.tar.gz 步骤二:安装nginx依赖包 yum install -y gcc ...
 - Linux基础学习-命令行与图形界面切换
			
命令行模式和图形界面模式切换 打开文件 vim /etc/inittab # systemd uses 'targets' instead of runlevels. By default, ther ...
 - word break和word wrap
			
默认情况下,如果同一行中某个单词太长了,它就会被默认移动到下一行去: word break(normal | break-all | keep-all):表示断词的方式 word wrap(norma ...