jquery getJSON()解析JSON数据(跨域)

作者:袖梨 2022-11-14

getJSON()这个就是我今天要讲的jquery操作json数据的函数
jQuery.getJSON( url, [data,] [success(data, textStatus, jqXHR)] )

urlA string containing the URL to which the request is sent.

dataA map or string that is sent to the server with the request.

success(data, textStatus, jqXHR)A callback function that is executed if the request succeeds.

回调函数中接受三个参数,第一个书返回的数据,第二个是状态,第三个是jQuery的XMLHttpRequest,我们只使用到第一个参数。

$.each()是用来在回调函数中解析JSON数据的方法,下面是官方文档:

jQuery.each( collection, callback(indexInArray, valueOfElement) )

collectionThe object or array to iterate over.

callback(indexInArray, valueOfElement)The function that will be executed on every object

使用 AJAX 请求来获得 JSON 数据,并输出结果:

代码如下 复制代码

$("button").click(function(){
$.getJSON("demo_ajax_json.js",function(result){
$.each(result, function(i, field){
$("div").append(field + " ");
});
});
});

从 test.js 载入 JSON 数据并显示 JSON 数据中一个 name 字段数据:

代码如下 复制代码

$.getJSON("test.js", function(json){
alert("JSON Data: " + json.users[3].name);
});

$.getJSON()跨域请求


1,同一域名下和其他的请求可以是一样的
js:

代码如下 复制代码

var url="http://localhost:2589/a.ashx";
$(function(){
$.getJSON(url,function(data){
alert (data.Name);
})
});

服务器返回字符串:
{"Name":"loogn","Age":23}
2,不同域名下
js:

代码如下 复制代码

var url="http://localhost:2589/a.ashx?callback=?";
$(function(){
$.getJSON(url,function(data){
alert (data.Name);
})
});

服务器返回字符串:
jQuery1706543070425920333_1324445763158({"Name":"loogn","Age":23})
返回的字符串就是一个调用一个叫“jQuery1706543070425920333_1324445763158” 的函数,参数是{"Name":"loogn","Age":23}。
其实这个很长的函数名是请求路径中callback=?的作用,我想应该是这样的:$.getJSON方法生成一个对回调方法的引用的名字,换掉?。上面请求会变成
http://localhost:2589/a.ashx?callback=jQuery1706543070425920333_1324445763158&_=1324445763194,所服务器回返json时要处理一下,如:

代码如下 复制代码

string cb = context.Request["callback"];
context.Response.Write(cb + "(" + json + ")");

参数名callback也可换成jsoncallback,我想是怕冲突吧,jsoncallback应该优先检测,没有再检测callback(没测试!!)
?也可是具体的函数名,这样回调函数就不能是匿名的了,用?生成只是jQuery为我们的一般操作提供的一个便利。

中文字符参数乱码问题 .


发生这个情况,首先查看Web服务器的编码。比如: 使用tomcat,可以查看
conf/server.xml 文件中标签中有没有设置URIEncoding,如果有就是根据这个编码做转换,如果没有这个默认为“ISO-8059”。

如果URIEncoding="GBK",后台代码如下:

Java代码

代码如下 复制代码

1. String test = request.getParameter("test"); // 前端传回来的中文字符
2. test = new String(test .getBytes("gbk"), "utf-8"); // 转成UTF-8格式

String test = request.getParameter("test"); // 前端传回来的中文字符
test = new String(test .getBytes("gbk"), "utf-8"); // 转成UTF-8格式


注意: ‘gbk', 'utf-8' 要小写


Java代码

解决方法1:

代码如下 复制代码
前台修改为
var data = {name:encodeURI($("#myName").val(),"utf-8"),pwd:"password"};
后台修改为
String name=URLDecoder.decode(request.getParameter("name"),"utf-8");

解决方法2:

代码如下 复制代码
前台修改为
var data = {name:encodeURI($("#myName").val(),"utf-8"),pwd:"password"};
后台修改为
String name=URLDecoder.decode(request.getParameter("name"),"utf-8");

相关文章

精彩推荐