c ajax后台传参jason格式,Ajax向前后台传递json和转换

学生管理系统MVC模式设计心得：

jquery .ajax提交data数据格式

jquery 的Ajax方法提交数据，但是是多个参数，具体data的格式如下：

data提交的数据类型为：Object或 String

data数据说明：发送到服务器的数据。如果不是字符串，将会被转换为字符串。

GET请求将会被附加到URL后面。防止自动转换。对象必须为key/value数据格式。

例如：{foo1:"bar1",foo2:"bar2"}转换为 &foo1=bar1&foo2=bar2。

如果是数组，JQuery将自动为不同的值类型对应同一个名称。

例如：{foo:["bar1","bar2"]}转换为&foo=bar1&foo=bar2。

也就是在JQuery中ajax提交data的数据格式为：{x:"x1",x2:"x3"}这种方式，如果有参数传入，格式如下：

data: {get_id: get_item_id,filter:"item"},

get_item_id是外部的参数。

Ajax从后台返回前台的数据类型dataType参数：

•"xml": 返回 XML 文档，可用 jQuery 处理

•"html": 返回纯文本 HTML 信息；包含的 script 标签会在插入 dom 时执行

•"script": 返回纯文本 JavaScript 代码。不会自动缓存结果。除非设置了 “cache” 参数。

注意：在远程请求时(不在同一个域下)，所有 POST 请求都将转为 GET 请求。(因为将使用 DOM 的 script标签来加载)

•"json": 返回 JSON 数据

•"jsonp": JSONP 格式。使用 JSONP 形式调用函数时,

如 "myurl?callback=?" jQuery 将自动替换 ? 为正确的函数名，以执行回调函数

•"text": 返回纯文本字符串

json的传递：

将java的List类型返回前台时，先将List转换为包含 json对象的JSONArray数组再传回前端

需要的jar包：json-lib-2.4-jdk15.jar 及其依赖包

后台：

List student_list = new ArrayList();

JSONArray jsonArray2 = JSONArray.fromObject(student_list);

//JSONArray: [{no:"123", name:"张三"}，{no:"124", name:"李四"}，{...},{...}]

PrintWriter printWriter = response.getWriter();

printWriter.print(jsonArray2);

前台：

function MyAjax(url, send_data, successFun,beforeSendFun,isAsync) {

if (isAsync == null)

isAsync = true;

$.ajax({

url : url,

type : "POST",

data : send_data,

async : isAsync,

dataType:'json',

beforeSend : beforeSendFun,

success : function(return_data) {

successFun(return_data);

},

error : function(XMLHttpRequest, textStatus, errorThrown) {

alert("请求处理失败");

}

});

}

Ajax前台向后台传递对象：

将js对象或者json对象转换为json字符串在Ajax传递，在后台中再将json字符串转换为json对象，再转换为java对象

var student={

name:"abc",

age:12,

no:"123"

};

console.log(student);

//将js对象转换为json字符串通过ajax传递，在后台中再将json字符串转换为json对象再转换为java对象

student = JSON.stringify(student);

Ajax:

$.ajax({

url : url,

type : "POST",

data : {

sendData:"传递下面的json字符串",

jsonStr: student

},

async : isAsync,

dataType:data_type,

beforeSend : beforeSendFun,

success : function(return_data) {

successFun(return_data);

},

error : function(XMLHttpRequest, textStatus, errorThrown) {

alert("请求处理失败");

}

});

后台解析：

String sendData = request.getParameter("sendData");

if (sendData.equals("传递下面json字符串")){

String jsonStr = request.getParameter("jsonStr");

JSONObject student_json= new JSONObject().fromObject(jsonStr);//将json字符串转换为json对象

Student student = (Student)JSONObject.toBean(student_json,Student.class);//再将json对象转换为Student对象

}

json格式转换:

JS对象格式:

var obj = {

name: "饼干",

code: "PC-001",

price: 360,

getInfo: function () {

return this.name;

}

}

json对象:

var obj = {

name: "饼干",

code: "PC-001",

price: 360,

getInfo: function () {

return this.name;

}

}

json字符串格式：

jsonStr="{"a":"adc","b":123,"c":"哈哈"}"

json对象，js对象，json字符串，java对象之间的常用转换：

str=JSON.stringify(obj); json对象转换为json字符串

obj=JSON.parse(str); json字符串转换为json对象

var obj={

a:"adc",

b:123,

c:"哈哈"

};

console.log(obj);//js对象

obj=JSON.stringify(obj);//转换为json字符串

console.log(obj);

10 //obj="{"a":"adc","b":123,"c":"哈哈"}"

obj=JSON.parse(obj);//json字符串转换为json对象

console.log(obj);

//{a: "adc", b: 123, c: "哈哈"}

一、JSON字符串转化为JSON对象

假设我们有如下 JSON 字符串需要转换为 JSON 对象。

var jsonStr = '[{"CityId":18,"CityName":"西安"},{"CityId":53,"CityName":"广州"}]';

1，使用eval()函数进行转换

使用 eval() 转换时需要在 json 字符外包裹一对小括号。

ie8(兼容模式)、ie7、ie6 不要使用此方法。

var jsonObj = eval('(' + jsonStr + ')');

alert(jsonObj[0]["CityName"]);

2，使用JSON.parse()方法进行转换

var jsonObj = JSON.parse(jsonStr);

3，使用json2.js进行转换

json2.js 提供了 json 的序列化和反序列化方法，完美支持各个浏览器。

使用时我们首先要将 json2.js 引用进来，源码地址：https://github.com/douglascrockford/JSON-js

var jsonObj = JSON.parse(jsonStr);

4，使用jQuery进行转换

如果我们项目中有使用 jQuery，那么直接使用 $.parseJSON() 方法即可，而且可以确保各个浏览器的兼容性。

var jsonObj = $.parseJSON(jsonStr);

二、JSON对象转化为JSON字符串

假设我们有如下的对象：

var jsonObj = {

"CityId":"18",

"CityName":"西安2"

};

1，使用JSON.stringify()方法进行转换

该方法不支持较老版本的IE浏览器，比如：ie8(兼容模式)、ie7、ie6。

运行结果如下：

var jsonStr = JSON.stringify(jsonObj);

alert(jsonStr);

2，使用json2.js进行转换

下载使用 json2.js，具体地址参考前面内容。使用方式和上面一样。

var jsonStr = JSON.stringify(jsonObj);

3，使用jQuery进行转换

首先对 jQuery 进行扩展，增加个 json 对象转字符串的方法。

jQuery.extend({

stringify : function stringify(obj) {

var t = typeof (obj);

if (t != "object" || obj === null) {

// simple data type

if (t == "string") obj = '"' + obj + '"';

return String(obj);

} else {

// recurse array or object

var n, v, json = [], arr = (obj && obj.constructor == Array);

for (n in obj) {

v = obj[n];

t = typeof(v);

if (obj.hasOwnProperty(n)) {

if (t == "string") v = '"' + v + '"';

else if (t == "object" && v !== null) v = jQuery.stringify(v);

json.push((arr ? "" : '"' + n + '":') + String(v));

}

}

return (arr ? "[" : "{") + String(json) + (arr ? "]" : "}");

}

}

});

使用方式如下：

var jsonStr = $.stringify(jsonObj);

1.将json字符串转换java对象

JSONObject jsonObj = new JSONObject().fromObject(jsonStr);//将json字符串转换为json对象

//将json对象转换为java对象

Student student =(Student)JSONObject.toBean(jsonObj,Student.class);//将json对象转换为Student对象

1.将java对象转换json字符串

//先将java对象转换为json对象，在将json对象转换为json字符串

JSONObject json = JSONObject.fromObject(obj);//将java对象转换为json对象

String str = json.toString();//将json对象转换为字符串

ajax向后台传递数组参数并将后台响应的数据赋值给一个变量供其它插件使用

1.在js中封装ajax向后台传递数组参数函数 //combogrid * * @Description 封装ajax向后台传递数组参数并将后台响应的数据赋值给一个变量方便其他插件使用该数据函数 * ...

ajax往后台传json格式数据报415错误

问题描述: ajax往后台传json格式数据报415错误,如下图所示 页面代码 function saveUser(){ var uuId = document.getElementById(&quo ...

【转】jQuery.ajax向后台传递数组问题

$.ajax({ url: "/xxx", type: "GET", data: { "boxIds": boxIds, "box ...

jQuery.ajax向后台传递数组问题

今天重温了一个问题,jQuery.ajax向后台传递一个数组,而在后台接收不到该值 前台js方法部分代码如下: //创建一个测试数组 var boxIds = new Array(); boxIds. ...

ajax获取后台传递的json数据

最近在使用JQuery的ajax方法时,需要返回的数据为json数据,在success返回中数据处理会根据返回方式不同会采用不同的方式来生成json数据.在$.ajax方法中应该是如何来处理的,简 ...

使用Ajax向SpringMVC传递Json数据

这篇文章已经过时了. 请参考比较合适的前后端交互方式. 1.保证SpringMVC配置成功了. 2.在pom.xml中追加Jackson相关的依赖

easyui之datagrid之formatter(后台传递常量自动转换值)

1,datagrid之formatter formatter格式化函数有三个参数: value:字段值(一般为后台传递给前台的值): row:当前行数据: index:当前行索引. return值是显 ...

JS向后台传递json数组对象

var Obj = []; //一下代码可以循环插入 var returnObj = new Object();//创建一个对象 returnObj.id = “123”: returnObj.mon ...

aspx后台传递Json到前台的两种接收方法

第一种:前台接收 dataType: "json",                success: function (data) {                    va ...

随机推荐

Android中通过反射获取资源Id

package com.cp.utils; import android.content.Context; public class CPResourceUtil { public static in ...

python入门练习题2

1,制作表格 循环提示用户输入:用户名,密码,邮箱(要求用户输入的长度超过20个字符,如果超过则只有前20个字符有效) 如果用户输入q或Q就退出程序,将用户输入的内容以表格形式显示 user_inpu ...

【hoj】1604 cable master

简单,二分法,可是在oj上交的时候会有精度的限制,所以仅仅能把数扩得大一点,并且在扩的时候为防止尾数会自己主动生成一些非零数,所以还是自己吧扩到的位置设置为0,还有输出时由于%.2lf会自己有4设5入 ...

【Keras】从两个实际任务掌握图像分类

我们一般用深度学习做图片分类的入门教材都是MNIST或者CIFAR-10,因为数据都是别人准备好的,有的甚至是一个函数就把所有数据都load进来了,所以跑起来都很简单,但是跑完了,好像自己还没掌握图片 ...

通过Visualizing Representations来理解Deep Learning、Neural network、以及输入样本自身的高维空间结构

catalogue . 引言 . Neural Networks Transform Space - 神经网络内部的空间结构 . Understand the data itself by visua ...

MVC5 Entity Framework学习

MVC5 Entity Framework学习(1):创建Entity Framework数据模型 MVC5 Entity Framework学习(2):实现基本的CRUD功能 MVC5 Entity ...

python中的特殊成员

python中的特殊成员: 小甲鱼论坛总结

<;!DOCTYPE html>;有什么用？

是文档声明,必须放在文档第一行,它的作用就是告诉浏览器以哪个html版本来解析你的html代码.当你不写声明的时候,浏览器就会以自己的怪异模式来解析你的ht ...

推荐十款java开源中文分词组件

1:Elasticsearch的开源中文分词器 IK Analysis(Star:2471) IK中文分词器在Elasticsearch上的使用.原生IK中文分词是从文件系统中读取词典,es-ik本身 ...

LeetCode 566. Reshape the Matrix (C++)

题目: In MATLAB, there is a very useful function called 'reshape', which can reshape a matrix into a n ...