jQuery.ajax向后台传递数组问题的解决方法


Posted in jQuery onMay 12, 2017

今天重温了一个问题,jQuery.ajax向后台传递一个数组,而在后台接收不到该值。

前台js方法部分代码如下:

//创建一个测试数组
var boxIds = new Array();
boxIds.push(12182);
boxIds.push(12183);
boxIds.push(12184);
//向后台交互
$.ajax({
  url: "/xxx",
  type: "GET",
  data: {
    "boxIds": boxIds,
    "boxType": 0,
    "time": new Date().getTime()
  },
  success: function(data) {
    //do sth...
  }
});

后台controller代码(SpringMVC)

@ResponseBody
@RequestMapping(value = "/box/changeLock")
public String changeLock(final Long[] boxIds, final int boxType) {
  return locker_ChangeLockService.changeLock(boxIds, boxType);
}

观察浏览器中发送的请求,可以发现参数如下:

jQuery.ajax向后台传递数组问题的解决方法

可以看到,参数的名字为boxIds[]而不是我们所定义的boxIds,也就是说,当传递数组时,会在我们的数组名称后自动加上”[]”,所以后台接不到。

解决办法:

设置jQuery.ajax的tradional属性

$.ajax({
  url: "/xxx",
  type: "GET",
  data: {
    "boxIds": boxIds,
    "boxType": 0,
    "time": new Date().getTime()
  },
  traditional: true,//这里设置为true
  success: function(data) {
    //do sth...
  }
});

修改之后重新发出请求,观察浏览器:

jQuery.ajax向后台传递数组问题的解决方法

请求参数2

这次参数不带”[]”了,并且后台可以成功接收到该数组。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

jQuery 相关文章推荐
使用jQuery,Angular实现登录界面验证码详解
Apr 27 jQuery
Jquery把获取到的input值转换成json
May 15 jQuery
Spring shiro + bootstrap + jquery.validate 实现登录、注册功能
Jun 02 jQuery
jQuery Jsonp跨域模拟搜索引擎
Jun 17 jQuery
原生js jquery ajax请求以及jsonp的调用方法
Aug 04 jQuery
jQuery实现的弹幕效果完整实例
Sep 06 jQuery
jQuery中ajax获取数据赋值给页面的实例
Dec 31 jQuery
jQuery插件jsonview展示json数据
May 26 jQuery
jQuery实现checkbox全选功能完整实例
Jul 12 jQuery
jQuery操作动画完整实例分析
Jan 10 jQuery
JQuery表单元素取值赋值方法总结
May 12 jQuery
JQuery插件tablesorter表格排序实现过程解析
May 28 jQuery
jQuery遮罩层实例讲解
May 11 #jQuery
jQuery zTree树插件动态加载实例代码
May 11 #jQuery
jQuery实现的简单在线计算器功能
May 11 #jQuery
jQuery+PHP+Mysql实现抽奖程序
Apr 12 #jQuery
JQuery实现定时刷新功能代码
May 09 #jQuery
jQuery插件开发发送短信倒计时功能代码
May 09 #jQuery
jquery.uploadifive插件怎么解决上传限制图片或文件大小问题
May 08 #jQuery
You might like
php中如何执行linux命令详解
2018/11/06 PHP
PHP实现基于状态的责任链审批模式详解
2019/05/31 PHP
PHP学习记录之常用的魔术常量详解
2019/12/12 PHP
重定向实现代码
2006/11/20 Javascript
JS 无法通过W3C验证的处理方法
2010/03/09 Javascript
用jquery和json从后台获得数据集的代码
2011/11/07 Javascript
ajax页面无刷新 IE下遭遇Ajax缓存导致数据不更新的问题
2012/12/11 Javascript
基于jQuery实现的菜单切换效果
2015/10/16 Javascript
AngularJS动态绑定HTML的方法分析
2016/11/07 Javascript
js实现textarea限制输入字数
2017/02/13 Javascript
javascript实现电脑和手机版样式切换
2017/11/10 Javascript
详解用vue2.x版本+adminLTE开源框架搭建后台应用模版
2019/03/15 Javascript
Vue表单之v-model绑定下拉列表功能
2019/05/14 Javascript
解决layui富文本编辑器图片上传无法回显的问题
2019/09/18 Javascript
简单了解前端渐进式框架VUE
2020/07/20 Javascript
vue 解决无法对未定义的值,空值或基元值设置反应属性报错问题
2020/07/31 Javascript
在nuxt中使用路由重定向的实例
2020/11/06 Javascript
[00:48]DOTA2国际邀请赛公开赛报名开始 扫码开启逐梦之旅
2018/06/06 DOTA
Python 元组(Tuple)操作详解
2014/03/11 Python
Python3中使用urllib的方法详解(header,代理,超时,认证,异常处理)
2016/09/21 Python
python将txt文档每行内容循环插入数据库的方法
2018/12/28 Python
Python3+Appium安装使用教程
2019/07/05 Python
python中将两组数据放在一起按照某一固定顺序shuffle的实例
2019/07/15 Python
python实现通过队列完成进程间的多任务功能示例
2019/10/28 Python
Windows下python3安装tkinter的问题及解决方法
2020/01/06 Python
基于canvas的骨骼动画的示例代码
2018/06/12 HTML / CSS
四年大学生活的自我评价范文
2014/02/07 职场文书
小学英语课后反思
2014/04/26 职场文书
营销学习心得体会
2014/09/12 职场文书
学校联谊协议书
2014/09/16 职场文书
教师求职简历自我评价
2015/03/10 职场文书
暑假生活随笔
2015/08/15 职场文书
小学三年级班主任工作经验交流材料
2015/11/02 职场文书
先进个人事迹材料(2016推荐版)
2016/03/01 职场文书
2019 入党申请书范文
2019/07/10 职场文书
导游词之永泰公主墓
2019/12/04 职场文书