jQuery向后台传入json格式数据的方法


Posted in Javascript onFebruary 13, 2015

本文实例讲述了jQuery向后台传入json格式数据的方法。分享给大家供大家参考。具体分析如下:

前后台数据交互一般都用json格式,后台可以直接将json对应转化为实体对象。方便以后的操作。jQuery向后台传数据的时候,我们会发现他会自动转化成查询字符串,不能真正传入一个json。而且用jquery对表单序列化的时候,返回的格式是一个数组,还需要作进一步转换。其实只要我们在ajax方法中配置一些东西就可以完成。代码如下:

<form id="ff"> 
  <input type="text" name="test1"/> 
  <input type="text" name="test2"/> 
  <input type="text" name="test3"/> 
  <input type="text" name="test4"/> 
  <input type="button" id="save" value="save"/> 
</form> 

$("#save").on("click", function () { 
 var params = $("#ff").serializeArray(); 
 var j = {}; 
 for (var item in params) { 
   j[params[item].name] = params[item].value; 
 } 

 $.ajax({ 
   url:'index.html', 
   data:JSON.stringify(j), 
   type:'post', 
   dataType:'json', 
   headers:{ 
 Accept:"application/json", 
 "Content-Type":"application/json" 
   }, 
   processData:false, 
   cache:false 
 }).done(function (data) { 
 }); 

});

如果在chrome看到如图的显示格式,说明传入到后台的就是json格式

jQuery向后台传入json格式数据的方法

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
js 点击页面其他地方关闭弹出层(示例代码)
Dec 24 Javascript
javascript实现禁止复制网页内容
Dec 16 Javascript
常用的jQuery前端技巧收集
Dec 24 Javascript
jquery实现倒计时效果
Dec 14 Javascript
浅析javascript函数表达式
Feb 10 Javascript
JS防止网页被嵌入iframe框架的方法分析
Sep 13 Javascript
微信公众平台开发教程(四) 实例入门:机器人回复(附源码)
Dec 02 Javascript
React-router中结合webpack实现按需加载实例
May 25 Javascript
AngularJS 支付倒计时功能实现思路
Jun 05 Javascript
Vue组件之自定义事件的功能图解
Feb 01 Javascript
node之本地服务器图片上传的方法示例
Mar 26 Javascript
JQuery事件委托(适用于给动态生成的脚本元素添加事件)
Feb 01 jQuery
浅谈轻量级js模板引擎simplite
Feb 13 #Javascript
js实现拖拽效果
Feb 12 #Javascript
jQuery多个input求和的实现方法
Feb 12 #Javascript
JQuery实现防止退格键返回的方法
Feb 12 #Javascript
JavaScript自定义数组排序方法
Feb 12 #Javascript
zepto.js中tap事件阻止冒泡的实现方法
Feb 12 #Javascript
后台获取ZTREE选中节点的方法
Feb 12 #Javascript
You might like
php curl 上传文件代码实例
2015/04/27 PHP
Yii框架ACF(accessController)简单权限控制操作示例
2019/04/26 PHP
Yii中特殊行为ActionFilter的使用方法示例
2020/10/18 PHP
ajax异步刷新实现更新数据库
2012/12/03 Javascript
js中函数声明与函数表达式
2015/06/03 Javascript
在JavaScript中使用NaN值的方法
2015/06/05 Javascript
jquery实现可点击伸缩与展开的菜单效果代码
2015/08/31 Javascript
JS DOM实现鼠标滑动图片效果
2020/09/17 Javascript
jQuery Mobile操作HTML5的常用函数总结
2016/05/17 Javascript
JS实现兼容各种浏览器的高级拖动方法完整实例【测试可用】
2016/06/21 Javascript
jQuery实现简单的tab标签页效果
2016/09/12 Javascript
JS给Array添加是否包含字符串的简单方法
2016/10/29 Javascript
js控制一个按钮是否可点击(可使用)disabled的实例
2017/02/14 Javascript
React+react-dropzone+node.js实现图片上传的示例代码
2017/08/23 Javascript
AngularJS对动态增加的DOM实现ng-keyup事件示例
2018/03/12 Javascript
angular 实时监听input框value值的变化触发函数方法
2018/08/31 Javascript
Layui多选只有最后一个值的解决方法
2019/09/02 Javascript
使用JS来动态操作css的几种方法
2019/12/18 Javascript
vue分页插件的使用方法
2019/12/25 Javascript
js实现简单点赞操作
2020/03/17 Javascript
Python中方法链的使用方法
2016/02/23 Python
Python引用模块和查找模块路径
2016/03/17 Python
Python Pandas 获取列匹配特定值的行的索引问题
2019/07/01 Python
Lombok插件安装(IDEA)及配置jar包使用详解
2020/11/04 Python
五种Python转义表示法
2020/11/27 Python
HTML5+CSS3模仿优酷视频截图功能示例
2017/01/05 HTML / CSS
Lacoste澳大利亚官网:服装、鞋类及配饰
2018/11/14 全球购物
大学生个人求职信范文
2013/09/21 职场文书
婚礼证婚人证婚词
2014/01/08 职场文书
股东出资证明书范例
2014/10/04 职场文书
2015年度内部审计工作总结
2015/05/20 职场文书
pycharm2021激活码使用教程(永久激活亲测可用)
2021/03/30 Python
解决Mysql的left join无效及使用的注意事项说明
2021/07/01 MySQL
python使用BeautifulSoup 解析HTML
2022/04/24 Python
Android开发之底部导航栏的快速实现
2022/04/28 Java/Android
使用HBuilder制作一个简单的HTML5网页
2022/07/07 HTML / CSS