jQuery使用JSONP實現(xiàn)跨域獲取數(shù)據(jù)的三種方法詳解

本文實例講述了jQuery使用JSONP實現(xiàn)跨域獲取數(shù)據(jù)的三種方法。分享給大家供大家參考，具體如下：

創(chuàng)新互聯(lián)建站長期為1000+客戶提供的網(wǎng)站建設(shè)服務(wù)，團隊從業(yè)經(jīng)驗10年，關(guān)注不同地域、不同群體，并針對不同對象提供差異化的產(chǎn)品和服務(wù)；打造開放共贏平臺，與合作伙伴共同營造健康的互聯(lián)網(wǎng)生態(tài)環(huán)境。為長壽企業(yè)提供專業(yè)的成都網(wǎng)站制作、網(wǎng)站建設(shè)，長壽網(wǎng)站改版等技術(shù)服務(wù)。擁有十年豐富建站經(jīng)驗和眾多成功案例,為您定制開發(fā)。

第一種方法是在ajax函數(shù)中設(shè)置dataType為'jsonp'

$.ajax({
  dataType: 'jsonp',
  url: 'http://www.a.com/user?id=123',
  success: function(data){
    //處理data數(shù)據(jù)
  }
});

第二種方法是利用getJSON來實現(xiàn)，只要在地址中加上callback=?參數(shù)即可

$.getJSON('http://www.a.com/user?id=123&callback=?', function(data){
  //處理data數(shù)據(jù)
});

第三種方法是使用getScript方法

//此時也可以在函數(shù)外定義foo方法
function foo(data){
  //處理data數(shù)據(jù)
}
$.getScript('http://www.a.com/user?id=123&callback=foo');

實例演練：

index.html

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>jsonp</title>
<script src="jquery-1.8.0.min.js"></script>
<script>
  $.ajax({
    type : "post",
    url : "jsonp.php?name=zhaoxiace&age=30",
    dataType : "jsonp",
    jsonp: "callbackParam",//傳遞給請求處理程序或頁面的，用以獲得jsonp回調(diào)函數(shù)名的參數(shù)名(默認為:callback)
    jsonpCallback:"callbackFunction",//自定義的jsonp回調(diào)函數(shù)名稱，默認為jQuery自動生成的隨機函數(shù)名
    success : function(data){
      console.log(data.statusCode + "/" + data.message + "/" + data.name + "/" + data.age);
    },
    error:function(){
      alert('請求失敗');
    }
  });
</script>
</head>

jsonp.php

<?
$data["age"] = $_GET['age'];
$data["name"] = $_GET['name'];
$data["statusCode"]="200";
$data["message"]="成功";
$tmp= json_encode($data); //json數(shù)據(jù)
echo $callback . '(' . $tmp .')'; //返回格式，必需
?>

PS：關(guān)于json操作，這里再為大家推薦幾款比較實用的json在線工具供大家參考使用：

在線JSON代碼檢驗、檢驗、美化、格式化工具：
http://tools.jb51.net/code/json

JSON在線格式化工具：
http://tools.jb51.net/code/jsonformat

在線XML/JSON互相轉(zhuǎn)換工具：
http://tools.jb51.net/code/xmljson

json代碼在線格式化/美化/壓縮/編輯/轉(zhuǎn)換工具：
http://tools.jb51.net/code/jsoncodeformat

在線json壓縮/轉(zhuǎn)義工具：
http://tools.jb51.net/code/json_yasuo_trans

更多關(guān)于jQuery相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《jQuery操作json數(shù)據(jù)技巧匯總》、《jQuery form操作技巧匯總》、《jQuery常用插件及用法總結(jié)》、《jQuery擴展技巧總結(jié)》、《jQuery表格(table)操作技巧匯總》及《jquery選擇器用法總結(jié)》

希望本文所述對大家jQuery程序設(shè)計有所幫助。

網(wǎng)頁題目：jQuery使用JSONP實現(xiàn)跨域獲取數(shù)據(jù)的三種方法詳解
本文路徑：http://chinadenli.net/article32/iecjpc.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站制作、網(wǎng)站改版、微信公眾號、全網(wǎng)營銷推廣、網(wǎng)站導(dǎo)航、App開發(fā)

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源：創(chuàng)新互聯(lián)

猜你還喜歡下面的內(nèi)容

欧美一区二区三区老妇人-欧美做爰猛烈大尺度电-99久久夜色精品国产亚洲a-亚洲福利视频一区二区

jQuery使用JSONP實現(xiàn)跨域獲取數(shù)據(jù)的三種方法詳解