ajax data参数
表单 使用serializeArray获取所有:
<form id='addForm' action='UserAdd.action' type='post'>
<label for='uname'>用户名</label>:<input type='text' name='uname' id='uname'><br>
<label for='mobileIpt'>手机号:</label><input type='text' name='mobileIpt' id='mobileIpt'><br>
<label for='birthday'>生日:</label><input type='text' name='birthday'><br>
<input type='button' value='提交' onclick='addUser()'>
</form>
$('#addForm').serializeArray();
//返回数据结构,是json数组,每个对像分别name和value为key,代表这个表单元素的name和value
[
{"name":"uname","value":""},
{"name":"mobileIpt","value":""},
{"name":"birthday","value":""}
]
我们使用JQuery.param()方法处理一下:
var arr = $('#addForm').serializeArray();
$.param(arr);
"uname=alice&mobileIpt=110&birthday=1983-05-12"
这里我们可以直接在ajax的data处填上这个json数组,在jquery内部自己调用$.param()处理的。
我们来看下jquery.param()方法的说明:
返回值:StringjQuery.param(obj,[traditional])
将表单元素数组或者对象序列化。 参数
obj,[traditional]
数组或jQuery对象会按照name/value对进行序列化,普通对象按照key/value对进行序列化。
traditional:是否使用传统的方式浅层序列化。 demo:
$.param({uanme:'vic',mobileIpt:'110',birthday:'2013-11-11'});
"uanme=vic&mobileIpt=110&birthday=2013-11-11"
看着说明,貌似也跟我们没关系啊,我们换一个json数组来看
$.param([{uanme:'vic'},{mobileIpt:'110'},{birthday:'2013-11-11'}]);
"undefined=&undefined=&undefined="
这个转换不成功了吧,为什么我们表单的那种数据能够成功转换成url参数呢?我们来看下jquery源码
//在ajax()方法中,对json类型的数据进行了$.param()处理
if ( s.data && s.processData && typeof s.data !== "string" ) {
s.data = jQuery.param( s.data, s.traditional );
} //param方法中
if ( jQuery.isArray( a ) || ( a.jquery && !jQuery.isPlainObject( a ) ) ) {
// Serialize the form elements
jQuery.each( a, function() {
add( this.name, this.value );
}); } else {
// If traditional, encode the "old" way (the way 1.3.2 or older
// did it), otherwise encode params recursively.
for ( prefix in a ) {
buildParams( prefix, a[ prefix ], traditional, add );
}
}
这下明白了吧,如果是json数据,那么挨个循环,只取他们的name属性和value属性拼接字符串。
如果是普通对象,循环该对象的属性,然后拼接字符串。
总结:
所以,本文要说的是,在jquery的ajax函数中,可以传入3种类型的数据
1.文本:"uname=alice&mobileIpt=110&birthday=1983-05-12"
2.json对象:{uanme:'vic',mobileIpt:'110',birthday:'2013-11-11'}
3.json数组:
[
{"name":"uname","value":"alice"},
{"name":"mobileIpt","value":"110"},
{"name":"birthday","value":"2012-11-11"}
]
所以,我们可以一键获取表单并提交,非常方便。 补充:
其实提取表单数据的话只需要serialize()方法直接获取"uname=alice&mobileIpt=110&birthday=1983-05-12"这样的就可以了。
ajax data参数的更多相关文章
- 关于Jquery中ajax方法data参数用法的总结
data 发送到服务器的数据.将自动转换为请求字符串格式.GET 请求中将附加在 URL 后.查看 processData 选项说明以禁止此自动转换.必须为 Key/Value 格式.如果为数组,jQ ...
- ASP.NET jquery ajax传递参数
第一种:GET传递 前台 ajax GET 传递 :即在请求的地址后面加上参数,URL地址长度有显示,安全性低 后台接收:Request.QueryString[“参数名字”]! 例如: func ...
- datatable 的ajax修改参数,post可以传参处理
datatables常用参数记录 { "searchable": false, "orderabl ...
- Spring MVC Ajax 复杂参数的批量传递
要解决的问题: 如何组织客户端参数? Ajax 方法的配置属性如何定义才能传递复杂参数? 基于 SpringMVC 的服务端该如何接收? MyBatis 怎么处理批量更新? 客户端脚本 viewMes ...
- jquery中的ajax方法参数
引用来自:http://www.cnblogs.com/tylerdonet/p/3520862.html jquery中的ajax方法参数总是记不住,这里记录一下. 1.url: 要求为String ...
- jQuery中$.ajax()方法参数解析
本文实例为大家讲解了jQuery $.ajax()方法参数,供大家参考,具体内容如下 $.ajax({ url:'test.do', data:{id:123,name:'xiaoming'}, ty ...
- 如何在 ajax 外拿到 ajax 的数据???和ajax的参数
第一步: var 变量名 = $.ajax({ url: "发送请求的地址", dataType: 'json', type: 'post', async: false }) 第 ...
- Ajax请求参数较长导致请求失败
Ajax请求参数比较长,第5行参数大概1100个字符吧,是接口的请求报文. $.ajax({ type:"POST", url:"${ctx}/test.action?m ...
- $.ajax 方法参数总是记不住,在这里记录一下
jquery中的ajax方法参数总是记不住,这里记录一下. 1.url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. 2.type: 要求为String类型的参数,请求方式(p ...
随机推荐
- rbenv配置
git clone https://github.com/rbenv/rbenv.git ~/.rbenv # 用来编译安装 ruby git clone git://github.com/sstep ...
- 浅谈FPGA有限状态机
状态机几乎可以实现一切时序电路. 有限状态机(FiniteStateMachine, FSM),根据状态机的输出是否与输入有关,可分为Moore型状态机和Mealy型状态机.Moore型状态机输出仅仅 ...
- 在Linux 64位系统下使用hugepage
首先,为什么要介绍/使用HugePage? 在步入正题之前,先讲一个非常普遍的数据库性能问题. 众所周知,Oracle数据库使用共享内存(SGA)来管理可以共享的一些资源;比如shared pool中 ...
- Mvn+Jetty启动项目
这里要注意,Mvn加jetty启动项目,主要用到的是Maven的jetty插件,和你下的Jetty服务器没什么关系. 我的运行环境是jdk1.7,Eclipse-mars,Maven是Eclipse自 ...
- Vue.js:路由
ylbtech-Vue.js:路由 1.返回顶部 1. Vue.js 路由 本章节我们将为大家介绍 Vue.js 路由. Vue.js 路由允许我们通过不同的 URL 访问不同的内容. 通过 Vue. ...
- xml处理模块
xml是实现不同语言或程序之间进行数据交换的协议,跟json差不多,但json使用起来更简单,不过,古时候,在json还没诞生的黑暗年代,大家只能选择用xml呀,至今很多传统公司如金融行业的很多系统的 ...
- Oracle sqlldr数据加载
1 sqlldr 传统路径:sqlldr会利用sql插入为我们加载数据 直接路径加载:sqlldr不适用sql,直接格式化数据块,绕开undo,避开redo,最快的方法就是并行直接路径加载 sqlld ...
- AOP(面向切面编程,翻译自MSDN)
目录 AOP的概念 静态实现AOP .Net 框架实现AOP(动态代理实现AOP) 动态代理AOP实现方法过滤 AOP参考 本文翻译自 :https://msdn.microsoft.com/en-u ...
- C Primer Plus学习笔记(九)- 数组和指针
数组 数组由数据类型相同的同一系列元素组成 需要使用数组时,通过声明数组告诉编译器数组中内含多少元素和这些元素的类型 普通变量可以使用的类型,数组元素都可以用 float candy[365]; // ...
- Python实现SSH连接远程服务器
首先需要安装paramiko模块 #-*- coding:utf-8 -*- __author__ = "MuT6 Sch01aR" import paramiko ssh = p ...