使用原始js和jQuery实现jsonp方式的跨域

1，使用原始js的方式实现跨域

<!-- 跨域-->
<script type="text/javascript">
//r是跨域服务器返回的数据
function jsonpCallback(r){
  if(r.code===1){
    if(r.status === 200){
      var data=r.data;
      var li='';
      for( var i=0;i<data.length;i++){
        li+='<li><a href="'+commonUrl+data[i].url+'"><img src="'+commonUrl + data[i].img+'" alt="" width="100" height="80"/><h4>'+data[i].title+'</h4><div class="text_conetnt"><p>'+data[i].desc+'</p></div><p class="play_num"><span>&nbsp;</span>'+data[i].hits+'</p></a></li>';
      }
      $("#videoList").append(li); 
    }else if(r.status === 400){
      alert(r.msg);
    }else if(r.status === 500){
      alert(r.msg);
    }
    
  }
  //否则提示用户拿取后端数据失败
  else{alert(r.msg);
  }
}
</script>
<script type="text/javascript" src="http://192.168.1.230/bss-vbs-uis/recommendVideos.action?callback=jsonpCallback"></script>

 

 

 

2，使用jQuery的方式实现跨域

//使用jQuery方式实现跨域
    $.ajax({
        url:"http://192.168.1.230/bss-vbs-uis/recommendVideos.action",
        dataType:'jsonp',
        data:'',
        jsonp:'callback',
        success:function(r) {
            if(r.code===1){
                if(r.status === 200){
                    var data=r.data;
                    var li='';
                    for( var i=0;i<data.length;i++){
                        li+='<li><a href="'+commonUrl+data[i].url+'"><img src="'+commonUrl + data[i].img+'" alt="" width="100" height="80"/><h4>'+data[i].title+'</h4><div class="text_conetnt"><p>'+data[i].desc+'</p></div><p class="play_num"><span>&nbsp;</span>'+data[i].hits+'</p></a></li>';
                    }
                    $("#videoList").append(li); 
                }else if(r.status === 400){
                  alert(r.msg);
                }else if(r.status === 500){
                  alert(r.msg);
                }
            }
            //否则提示用户拿取后端数据失败
            else{
                alert(r.msg);
            }
        },
        timeout:3000
    });