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 相关文章推荐
Mootools 1.2教程 Fx.Morph、Fx选项和Fx事件
Sep 15 Javascript
document.getElementById的简写方式(获取id对象的简略写法)
Sep 10 Javascript
浏览器打开层自动缓慢展开收缩实例代码
Jul 04 Javascript
javascript动态向网页中添加表格实现代码
Feb 19 Javascript
jQuery实现下拉框功能实例代码
May 06 Javascript
JavaScript根据CSS的Media Queries来判断浏览设备的方法
May 10 Javascript
第一次接触神奇的Bootstrap
Oct 14 Javascript
jQuery实现动态给table赋值的方法示例
Jul 04 jQuery
基于vue-simplemde实现图片拖拽、粘贴功能
Apr 12 Javascript
JS深入学习之数组对象排序操作示例
May 01 Javascript
javascript的hashCode函数实现代码小结
Aug 11 Javascript
Vue——前端生成二维码的示例
Dec 19 Vue.js
浅谈轻量级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 mail to 配置详解
2014/01/16 PHP
最常用的8款PHP调试工具
2014/07/06 PHP
使用php方法curl抓取AJAX异步内容思路分析及代码分享
2014/08/25 PHP
laravel框架学习笔记之组件化开发实现方法
2020/02/01 PHP
PHP与Web页面的交互示例详解二
2020/08/04 PHP
extjs 学习笔记 四 带分页的grid
2009/10/20 Javascript
在Node.js中实现文件复制的方法和实例
2014/06/05 Javascript
Bootstrap实现导航栏的2种方式
2016/11/28 Javascript
jQuery弹出层插件popShow用法示例
2017/01/23 Javascript
JavaScript内存泄漏的处理方式
2017/11/20 Javascript
详解在React.js中使用PureComponent的重要性和使用方式
2018/07/10 Javascript
基于vue实现移动端圆形旋钮插件效果
2018/11/28 Javascript
js/jQuery实现全选效果
2019/06/17 jQuery
Vue+tracking.js 实现前端人脸检测功能
2020/04/16 Javascript
JavaScript中的this妙用实例分析
2020/05/09 Javascript
原生JS实现九宫格抽奖
2020/09/13 Javascript
Python设置Socket代理及实现远程摄像头控制的例子
2015/11/13 Python
python的dataframe转换为多维矩阵的方法
2018/04/11 Python
Django后台获取前端post上传的文件方法
2018/05/28 Python
对Python subprocess.Popen子进程管道阻塞详解
2018/10/29 Python
python 字典访问的三种方法小结
2019/12/05 Python
Python猴子补丁知识点总结
2020/01/05 Python
python with (as)语句实例详解
2020/02/04 Python
keras读取训练好的模型参数并把参数赋值给其它模型详解
2020/06/15 Python
python 数据类型强制转换的总结
2021/01/25 Python
检测用户浏览器是否支持CSS3的方法
2009/08/29 HTML / CSS
澳大利亚领先的睡衣品牌:Peter Alexander
2016/08/16 全球购物
结婚典礼证婚词
2014/01/11 职场文书
优秀毕业生自我鉴定
2014/02/11 职场文书
2015年学校食堂工作总结
2015/04/22 职场文书
观后感的写法
2015/06/19 职场文书
致运动员赞词
2015/07/22 职场文书
2016春季小学开学寄语
2015/12/03 职场文书
Pandas 稀疏数据结构的实现
2021/07/25 Python
JAVA API 实用类 String详解
2021/10/05 Java/Android
如何优化vue打包文件过大
2022/04/13 Vue.js