标签: jsonp

  • JSON跨域调用与动态脚本加载

    下面是在anyjs中JSON跨域的实现(JSONP),原理很简单,动态生成script标签,没有使用到callback(可支持),需要与后台协调保持对象一致,anyjs默认采用JSONP。

    01 anyjs.gjsonp=function(url,callbackfn){
    02     var h=document.getElementsByTagName(‘head’)[0];
    03     var s=anyjs.create(‘script’);
    04     anyjs(s).set(‘type’, ‘text/javascript’).set(‘src’, url);
    05     anyjs(h).apd(s);
    06     if(anyjs.ie){ //IE6+
    07             s.onreadystatechange = function () {
    08             if (s.readyState == ‘loaded’ || s.readyState == ‘complete’) {
    09                 (callbackfn)(JSONP);
    10                 JSONP=null;
    11                anyjs(s).rmv();
    12             }
    13         }
    14     } else {//GECKOS、WEBKIT、ETC..
    15             s.onload = function() {
    16             (callbackfn)(JSONP);
    17             JSONP=null;
    18             anyjs(s).rmv();
    19         }
    20     }
    21     return false;
    22 };//end

    使用anyjs跨域调用示例:

    01 //JSONP跨域测试开始
    02 $(“#jsonp”).click(function(){
    03 y=$.create(“div”);
    04 $(y).set(“id”,“bglay”).set(“class”,“bglay”);
    05 $(“body”).ist(y);
    06 x=$.create(“div”);
    07 $(x).set(“id”,“ajax”);
    08 $(x).set(“class”,“ajax”);
    09 $(“body”).ist(x);
    10 $(“#ajax”).show();
    11 $.gjsonp(“http://www.focusstudio.org/data.php?type=jsonp”,function(data){
    12 var arr=[],str=“”;
    13 for(var i=0;i<data.length;i++){
    14
    15 arr.push(data[i].a);
    16 str+=data[i].b+“|”;
    17 }
    18 $(“#ajax”).h(arr.join(“‘”)+str);
    19 });
    20
    21 $(“#ajax”).click(function(){$(“div.bglay”,“#ajax”).fout();$(“div.bglay”,“#ajax”).rmv();});
    22 });
    23 //跨域jsonp测试结束

    后台相关代码:

    1 <?php
    2 header(“Content-Type:application/x-javascript; charset=utf-8”);
    3 $callback = isset($_GET[‘callback’]) ? $_GET[‘callback’] : ‘JSONP’;
    4 $json=array(array(‘a’=>‘enimo1jsonp’,‘b’=>‘test1jsonp’),array(‘a’=>‘enimo2’,‘b’=>‘test2jsonp’));
    5 echo ‘var ‘.$callback.‘=’.json_encode($json);
    6 ?>

    到这里,要实现动态加载js脚本,我想大家应该不言自明了吧。