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

来源:互联网 发布:淘宝美工主页设计 编辑:程序博客网 时间:2024/04/29 22:12
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>
测试时请直接将代码保存在本打开即可。


原创粉丝点击