Ajax的jsonp方式跨域獲取數(shù)據(jù)的簡(jiǎn)單實(shí)例
更新時(shí)間：2016年05月28日 16:51:42 投稿：jingxian
下面小編就為大家?guī)?lái)一篇Ajax的jsonp方式跨域獲取數(shù)據(jù)的簡(jiǎn)單實(shí)例。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
jsonp的調(diào)用，今天碰到了，正好整理了一下。
<!DOCTYPE html>
<html>
<head>
<script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#b01").click(function(){
$.ajax({//danielinbiti.txt文件內(nèi)容：getAInfo(["<input type='text' value='1222'/>"])
url: 'http://192.168.12.21:8080/systemr/danielinbiti.txt',
dataType: 'jsonp',//跨域設(shè)置jsonp
processData: false,
jsonpCallback:'getAInfo',//與文件中的getAInfo對(duì)應(yīng)
type: 'get',
success: function(data) {
$("#myDiv").html(data);
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
alert('error');
alert(XMLHttpRequest.status);
alert(XMLHttpRequest.readyState);
alert(textStatus);
}
});
});
$("#b02").click(function(){// 需要在后臺(tái)根據(jù)request獲取callback，然后才callback(需要返回的json內(nèi)容)的方式返回，getJSON是ajax的簡(jiǎn)化，只支持json格式
$.getJSON("http://192.168.12.21:8080/systemr/b.do?jsoncallback=?",function(result){
$("#myDiv").html(result);
});
});
});
</script>
</head>
<body>
<div id="myDiv"><h2>通過(guò) AJAX 改變文本</h2></div>
<button id="b01" type="button">改變內(nèi)容01</button>
<button id="b02" type="button">改變內(nèi)容02getJSON</button>
</body>
</html>
以上這篇Ajax的jsonp方式跨域獲取數(shù)據(jù)的簡(jiǎn)單實(shí)例就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
您可能感興趣的文章:
- jQuery使用JSONP實(shí)現(xiàn)跨域獲取數(shù)據(jù)的三種方法詳解
- 通過(guò)jsonp獲取json數(shù)據(jù)實(shí)現(xiàn)AJAX跨域請(qǐng)求
- JavaScript用JSONP跨域請(qǐng)求數(shù)據(jù)實(shí)例詳解
- 基于Jquery的跨域傳輸數(shù)據(jù)(JSONP)
- AJAX跨域請(qǐng)求之JSONP獲取JSON數(shù)據(jù)
- 使用jsonp實(shí)現(xiàn)跨域獲取數(shù)據(jù)實(shí)例講解
- AngularJS實(shí)現(xiàn)的JSONP跨域訪問(wèn)數(shù)據(jù)傳輸功能詳解
- jsonp跨域請(qǐng)求數(shù)據(jù)實(shí)現(xiàn)手機(jī)號(hào)碼查詢實(shí)例分析
- AJAX跨域請(qǐng)求JSONP獲取JSON數(shù)據(jù)的實(shí)例代碼
- jsonp跨域獲取數(shù)據(jù)的基礎(chǔ)教程
相關(guān)文章
用Promise解決多個(gè)異步Ajax請(qǐng)求導(dǎo)致的代碼嵌套問(wèn)題(完美解決方案)
這篇文章主要介紹了用Promise解決多個(gè)異步Ajax請(qǐng)求導(dǎo)致的代碼嵌套問(wèn)題(完美解決方案),需要的朋友可以參考下2017-02-02
Ajax異步傳輸想必大家并不陌生吧，下面為大家介紹下與PHP實(shí)現(xiàn)交互的示例，大家不要錯(cuò)過(guò)2014-01-01
純javascript的ajax實(shí)現(xiàn)php異步提交表單的簡(jiǎn)單實(shí)例
下面小編就為大家?guī)?lái)一篇純javascript的ajax實(shí)現(xiàn)php異步提交表單的簡(jiǎn)單實(shí)例。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-05-05
仿google搜索提示 SuggestFramework的使用
使用幫助（英文版翻譯而來(lái)，可能有錯(cuò)誤，請(qǐng)大家仔細(xì)核對(duì)，也希望對(duì)新手理解能有所幫助）2008-09-09
本文通過(guò)三個(gè)實(shí)例給大家講解了Ajax和$.ajax使用實(shí)例詳解，非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友參考下2017-02-02
最近二天。項(xiàng)目做完了。閑著沒(méi)事做就自己寫(xiě)了一點(diǎn)東西。在寫(xiě)的過(guò)程中。發(fā)現(xiàn)利用服務(wù)器的文本框去查找用戶的相關(guān)信息的時(shí)刻總要去刷新頁(yè)面。2009-06-06
這篇文章主要介紹了ajax實(shí)現(xiàn)遠(yuǎn)程通信的相關(guān)資料，感興趣的小伙伴們可以參考一下2016-07-07
如何實(shí)現(xiàn)ajax延時(shí)發(fā)送在空閑之后去發(fā)送ajax請(qǐng)求
關(guān)鍵字搜索的功能，還是比較實(shí)用的，在實(shí)現(xiàn)過(guò)程中就需用到ajax延時(shí)發(fā)送，下面有個(gè)不錯(cuò)的示例，有需要的朋友可以參考下2013-12-12
這篇文章主要為大家詳細(xì)介紹了Ajax如何傳輸Json和xml數(shù)據(jù),具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-09-09
Ajax 提交表單數(shù)據(jù)到入庫(kù)的全盤(pán)操作流程分享
以下是Ajax 提交表單數(shù)據(jù)到入庫(kù)的全盤(pán)操作流程，希望本文對(duì)廣大php開(kāi)發(fā)者有所幫助，感謝閱讀本文2014-01-01