javascript默认是允许跨域操作的，比如a.com下不能操作b.com下的DOM，ajax也一样。但是javascript却允许从a.com从b.com引用js文件，JSONP正式跟据这个原理实现了跨域操作。下面这个例子是采用jQuery框架的getJSON方法，注意必须添加callback=?参数，其中的“？”系统会自动替换。<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>JSONP调用爱查快递API</title>
<script language="javascript" src="js/jquery.js"></script>
<script language="javascript">
var _url='http://api.ickd.cn/?com=shentong&nu=468299202580&id=568AC6659ED39224A0E687698018D747&encode=utf8&type=json&callback=?';
function jsonp(){
$.getJSON(_url,function(json){
if(json.status && json.data){
var html='<table><tr><th>时间</th><th>进度</th></tr>';
$.each(json.data,function(i,item){
html+='<tr><td>'+item.time+'</td><td>'+item.context+'</td></tr>';
});
html+='</table>';
$('#json_re').html(html);
}
}
);
}
function a2(){
$.ajax({
url:_url,
type:'get',
dataType:'JSONP',
success:function(data){
alert(data);
}
});
}
</script>
</head>
<body>
<input type="button" onClick="jsonp()" value="测试">
<input type="button" onClick="a2()" value="测试">
<div id="json_re"></div>
</body>
</html>
测试时请直接将代码保存在本打开即可。
扫一扫
1656
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
