JSONP的客户端的具体实现
1.远程调用一个js,代码如下:
<script type="text/javascript">
var localHandler = function(data){
alert('我是本地函数,可以被跨域的remote.js文件调用,远程js带来的数据是:' + data.result);
};
</script>
<script type="text/javascript" src="http://remoteserver.com/remote.js"></script>
remote.js文件代码如下:
localHandler({"result":"我是远程js带来的数据"});
2.动态生成脚本
<script type="text/javascript">
// 得到航班信息查询结果后的回调函数
var flightHandler = function(data){
alert('你查询的航班结果是:票价 ' + data.price + ' 元,' + '余票 ' + data.tickets + ' 张。');
};
// 提供jsonp服务的url地址(不管是什么类型的地址,最终生成的返回值都是一段javascript代码)
var url = "http://flightQuery.com/jsonp/flightResult.aspx?code=CA1998&callback=flightHandler";
// 创建script标签,设置其属性
var script = document.createElement('script');
script.setAttribute('src', url);
// 把script标签加入head,此时调用开始
document.getElementsByTagName('head')[0].appendChild(script);
</script>
flightHandler({
"code": "CA1998",
"price": 1780,
"tickets": 5
});
3.封装代码
把代码封装一下,以便于与用户界面交互,从而实现多次和重复调用。
相关文章
- Html5实现头像上传和编辑,保存为Base64的图片过程
- 使用插件bootstrap-table实现表格记录的查询、分页、排序等处理
- 基于Xamarin Android实现的简单的浏览器
- TCP的核心系列 — SACK和DSACK的实现(二)
- IOS中Hybird中数据驱动与脚本驱动的实现
- AppCompatActivity实现全屏的问题
- spring ----> aop的两种实现方式
- 【PHP开发篇】一个统计客户端商机提交的获取IP地址
- 超实用的JavaScript代码段 Item5 --图片滑动效果实现
- [置顶] Web用户的身份验证及WebApi权限验证流程的设计和实现 (不是Token驗證!!!不是Token驗證!!!都是基於用户身份的票据信息驗證!!!)