jquery ajax传递数组给php
2014-08-04 23:13 youxin 阅读(6514) 评论(0) 编辑 收藏 举报写成:var data = {'item[]':item};
$.post(url,data,function(return_data)
写成item:item会导致数据缺失。
更多:http://www.cnblogs.com/ini_always/archive/2011/12/17/2291290.html
ajax传递数组:
最近在用jQuery的ajax方法发送请求时需要发送一个数组作为参数,结果在后台接收的时候发现接收不到这个数组。代码时这样的:
1
2
3
4
5
6
7
8
9
|
var arr = [] arr.push(“aaa”); arr.push(“bbb”); arr.push(“ccc”); $.ajax({ url:”a.html”, data:{“arr”:arr}, type:”post” }); |
查看firebug的网络信息,发现发送的post信息中的数组信息为&arr[]=aaa&arr[]=bbb&arr[]=ccc。多了一对方括号,所以在servlet中不能通过request.getParameter(‘arr’)获取到正常的数组参数。
(经过验证,java servlet中必须这么写:
traditional:
true
//这个设置为true,data:{"steps":["qwe","asd","zxc"]}会转换成steps=qwe&steps=asd&...
$.ajax({
traditional:
true,
data:{ 'arr':nameArr} } 不能写成 'arr[] '
servlet那边接收:
String[] arr=request.getParameterValues(arr");
)
google之后发现,需要在data参数里,加一个traditional:true的参数,这样就能正常发送数组参数了。
原因时从1.4以后,jQuery改变了参数的序列化方法。
traditional:
一般的,可能有些人在一个参数有多个值的情况下,可能以某个字符分隔的形式传递,比如页面上有多个checkbox:
1
2
3
4
5
6
|
$.ajax{ url: "xxxx" , data:{ p: "123,456,789" } } |
然后后台获取参数后再分隔,这种做法有很大弊端,试问如果某一个参数值中出现了分隔符所使用的字符,会出现什么情况呢?当然后台获取的参数将与实际情况不符.
这时我想到了将上述代码写成这样:
1
2
3
4
5
6
|
$.ajax{ url: "xxxx" , data:{ p: [ "123" , "456" , "789" ] } } |
如果单纯写成这样,在java后台是无法取到参数的,因为jQuery需要调用jQuery.param序列化参数,
1
|
jQuery.param( obj, traditional ) |
默认的话,traditional为false,即jquery会深度序列化参数对象,以适应如PHP和Ruby on Rails框架,
但servelt api无法处理,我们可以通过设置traditional 为true阻止深度序列化,然后序列化结果如下:
1
|
p: [ "123" , "456" , "789" ] => p=123&p=456&p=456 |
随即,我们就可以在后台通过request.getParameterValues()来获取参数的值数组了,
所以,比如我们前台有多个checkbox,前台的代码可以写成:
1
2
3
4
5
6
7
8
9
10
|
var values = $( "input[type=checkbox]" ).map( function (){ return $( this ).val(); }).get(); $.ajax{ url: "xxxx" , traditional: true , data:{ p: values } } |
http://tool.oschina.net/apidocs/apidoc?api=jquery
jQuery.param(obj,[traditional])
概述
将表单元素数组或者对象序列化。是.serialize()的核心方法。
在jQuery 1.3中,如果传递的参数是一个函数,那么用.param()会得到这个函数的返回值,而不是把这个函数作为一个字符串来返回。
在jQuery 1.4中,.param()会深度递归一个对象来满足现在脚本语言和框架,比如PHP, Ruby on Rails等。你可以通过jQuery.ajaxSettings.traditional = true; 来全局得禁用这个功能。
注意:因为有些框架在解析序列化数字的时候能力有限,所以当传递一些含有嵌套对象、数组的对象作为参数时,请务必小心!
在jQuery 1.4中,HTML5的input元素也会被序列化。
参数
objArray<Elements>/jQuery/ObjectV1.2
数组或jQuery对象会按照name/value对进行序列化,普通对象按照key/value对进行序列化。
obj,[traditional]Array<Elements>/jQuery/Object,BooleanV1.4
obj:数组或jQuery对象会按照name/value对进行序列化,普通对象按照key/value对进行序列化。
traditional:是否使用传统的方式浅层序列化。
示例
描述:
按照key/value对序列化普通对象。
jQuery 代码:
var params = { width:1680, height:1050 };
var str = jQuery.param(params);
$("#results").text(str);
结果:
width=1680&height=1050
描述:
对比两种序列化方式
jQuery 代码:
var myObject = {
a: {
one: 1,
two: 2,
three: 3
},
b: [1,2,3]
};
var recursiveEncoded = $.param(myObject);
var recursiveDecoded = decodeURIComponent($.param(myObject));
alert(recursiveEncoded);
alert(recursiveDecoded);
//a%5Bone%5D=1&a%5Btwo%5D=2&a%5Bthree%5D=3&b%5B%5D=1&b%5B%5D=2&b%5B%5D=3
//a[one]=1&a[two]=2&a[three]=3&b[]=1&b[]=2&b[]=3
var shallowEncoded = $.param(myObject, true);
var shallowDecoded = decodeURIComponent(shallowEncoded);
alert(shallowEncoded);
alert(shallowDecoded);
//a=%5Bobject+Object%5D&b=1&b=2&b=3
//a=[object+Object]&b=1&b=2&b=3
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· 无需6万激活码!GitHub神秘组织3小时极速复刻Manus,手把手教你使用OpenManus搭建本
· Manus爆火,是硬核还是营销?
· 终于写完轮子一部分:tcp代理 了,记录一下
· 别再用vector<bool>了!Google高级工程师:这可能是STL最大的设计失误
· 单元测试从入门到精通
2013-08-04 img src某个php文件输出图片(回复更改图片readfile读取图片等)
2013-08-04 img标签中的src为php文件
2013-08-04 转:优秀程序员不得不知道的20个位运算技巧
2013-08-04 C语言中 移位操作运算
2013-08-04 有符号和无符号数回绕问题(补码加法和补码减法)
2013-08-04 数组名和指针区别(还有数组退化等)
2013-08-04 无法从“const char *”转换为“char *”