jsonp.html
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<meta charset='UTF-8' />
<!-- demo1
<script type="text/javascript">
var localHandler = function(data){
alert('我是本地函数，可以被跨域的remote.js文件调用，远程js带来的数据是：' + data.result);
};
</script>
<script type="text/javascript" src="http://2.wenzg.applinzi.com/remote.js"></script>
-->
<!-- demo2
<script type="text/javascript">
// 得到航班信息查询结果后的回调函数
var flightHandler = function(data){
alert('你查询的航班结果是：航班号 '+ data.code +'， 票价 ' + data.price + ' 元，' + '余票 ' + data.tickets + ' 张。');
};
// 提供jsonp服务的url地址(不管是什么类型的地址，最终生成的返回值都是一段javascript代码)
var url = "http://2.wenzg.applinzi.com/remote.php?callback=flightHandler";
// 创建script标签，设置其属性
var script = document.createElement('script');
script.setAttribute('src', url);
// 把script标签加入head，此时调用开始
document.getElementsByTagName('head')[0].appendChild(script);
</script>
-->
<!-- demo3 -->
<script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function(){
$.ajax({
type: "get",
async: false,
url: "http://2.wenzg.applinzi.com/remote.php",
dataType: "jsonp",
jsonp: "callback",//传递给请求处理程序或页面的，用以获得jsonp回调函数名的参数名(一般默认为:callback)
jsonpCallback:"flightHandler",//自定义的jsonp回调函数名称，默认为jQuery自动生成的随机函数名，也可以写"?"，jQuery会自动为你处理数据
success: function(data){
alert('你查询的航班结果是：航班号 '+ data.code +'， 票价 ' + data.price + ' 元，' + '余票 ' + data.tickets + ' 张。');
},
error: function(){
alert('fail');
}
});
});
</script>
</head>
<body>
</body>
</html>
remote.php
<?php
if(isset($_GET['callback'])){
$json = '{"code": "CA1998","price": 1780,"tickets": 5}';
echo "flightHandler($json);";
}
remote.js
localHandler({"result":"我是远程js带来的数据"});
转载自：http://blogread.cn/it/article/7122
