夏日博客

A-A+

jquery读取jsonp数据示例

2016年01月07日 前端设计 暂无评论 阅读 5 views 次

读取jsonp数据的方法有蛮多的，下面来为大家介绍一个利用jquery来读取jsonp数据，希望文章对大家有帮助。

jquery读取jsonp数据，下面以PHP作为jsonp的返回服务端页面，用jquery的$.getJSON获取jsonp数据

示例PHP代码：

  1. $callback = $_GET["callback"];  
  2.     $a = array(  
  3.         'name'=>'张三',  
  4.         'sex'=>'男',  
  5.         'age'=>24,  
  6.         'name'=>'李四',  
  7.         'sex'=>'男',  
  8.         'age'=>26,  
  9.     );  
  10.     $result = json_encode($a);  
  11.     echo "$callback($result)";  
  12.     exit;  

jquery代码：

  1. $.getJSON("http://你的域名 /jsonp.php?callback=?",function(json){  
  2.             console.log(json.name);  
  3.  });  

测试发现getJSON 的callback 只能是 =? 不能是其他名字，如果是其他名字就提示跨域了，完整的ajax写法是可以的，如下：

  1. $.ajax({  
  2.             type: "GET",  
  3.             url:"http://你的域名/jsonp.php",  
  4.             dataType: "jsonp",  
  5.             jsonp: "callback",      //传递给请求处理程序或页面的，用以获得jsonp回调函数名的参数名(一般默认为:callback)  
  6.             jsonpCallback:"test",   //自定义的jsonp回调函数名称，默认为jQuery自动生成的随机函数名，也可以写"?"，jQuery会自动为你处理数据  
  7.             success: function(json){  
  8.                 console.log(json.name);  
  9.             },  
  10.             error: function(){  
  11.                 console.log("fail");  
  12.             }  
  13.         });  
  14.     });  
  15. //用$.ajax的方式是可以执行test(arr)的  
  16.     function test(arr){  
  17.         console.log(arr.name)  
  18.     }  
标签：

给我留言