您的位置：首页 > 其它

AJAX 跨域调用快递查询API接口

2012-04-12 19:05 375 查看

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>

测试时请直接将代码保存在本打开即可。

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航

AJAX 跨域调用 快递查询API接口

AJAX 跨域调用快递查询API接口