jQuery Ajax使用心得詳細整理及注意事項_AJAX教程
推薦：利用iframe實現(xiàn)ajax跨域通信的實現(xiàn)原理(圖解)一般情況下都是用在同一域下的ajax請求；但是如果請求是發(fā)生在不同的域下，請求就無法執(zhí)行，并且會拋出異常提示不允許跨域請求,接下來介紹利用iframe實現(xiàn)ajax跨域通信感興趣的朋友可以了解下，或許對你學(xué)習(xí)ajax跨域有所幫助
IE7及以下請求方式用GET的話，URL的限制是個很容易忽視的問題(最大2083個字符)。所以如果URL有可能過長的話，一定要用POST。--------------------------------------------------------------------------------
終止Ajax請求
終止請求需要調(diào)用XMLHttpRequest對象的abort()方法
而在jQuery中的$.get,$.post、$.ajax、$.getJSON、$.getScript...的返回值都是XMLHttpRequest對象.
調(diào)用abort()后，ajax請求立即停止，但仍然會執(zhí)行success的回調(diào)函數(shù)
所以在success的回調(diào)函數(shù)中需要先判斷 ajaxGet 或 data是否存在，存在才執(zhí)行回調(diào)函數(shù)
復(fù)制代碼 代碼如下:m.ghpqjb.com
var ajaxGet = $.get(someURL,someData,function(data){
if(!data)return true;
//TODO
});
ajaxGet.abort();
說到跨域資源共享(CORS Cross-Origin Resoure Sharing)，現(xiàn)在正變的越來越重要。各種地圖API，微博API等等，網(wǎng)站開發(fā)人員不必自己去放衛(wèi)星，只要根據(jù)別人開放的接口，就能獲取到這些數(shù)據(jù)。
這得益于跨源策略。
JSONP就是跨源策略的一種方案。基本原理就是利用瀏覽器允許跨域獲取script資源(包括圖片)的特點,在服務(wù)器端生成script Tag,并傳回客戶端。
要注意的是，服務(wù)器端返回的不是JSON格式的字符串，而是callbackName+"("+JSON_string+")"也就是JSONP。
這就相當(dāng)于服務(wù)器把一段JS代碼(被賦值的函數(shù))返回瀏覽器，然后立即執(zhí)行。
所以，在瀏覽器端發(fā)送的URL中(以GET的形式)，需要把回調(diào)函數(shù)名傳入。
客戶端：
復(fù)制代碼 代碼如下:m.ghpqjb.com
function deal(data){
//TODO
}
var s= document.createElement("script")
//不必一定叫callback，但是一定要跟服務(wù)器端的Request.QueryString匹配
s.src = "http://172.20.2.60:8088/newwebsite/MyHandler.ashx?callback=func";
document.body.appendChild(s)
服務(wù)器端(.Net)
復(fù)制代碼 代碼如下:m.ghpqjb.com
<%@ WebHandler Language="C#" Class="Test" %>
using System;
using System.Web;
public class Test : IHttpHandler {
public void ProcessRequest (HttpContext context) {
context.Response.Charset = "utf-8";
context.Response.ContentType = "text/javascript";
string callback = context.Request.QueryString["callback"];//回調(diào)函數(shù)名
string json = "{'name':'Ray','msg':'hello world!'}";//JSON格式的字符串
string result = string.Format("{0}({1})", callback, json);
context.Response.Write(result);
context.Response.Flush();
context.Response.End();
}
public bool IsReusable {
get {
return false;
}
}
}
用jQuery的話，URL中就不用加回調(diào)函數(shù)名了，因為jQuery已經(jīng)為你代勞了，而這個回調(diào)函數(shù)就是success。
復(fù)制代碼 代碼如下:m.ghpqjb.com
$.ajax({
url: "http://172.20.2.60:8088/newwebsite/MyHandler.ashx"
, dataType: "jsonp"
, success: function(data) {
//TODO
}
});
JSONP很強大，但是也有兩個讓人蛋疼的地方，首先是安全性問題。
不管怎么說你都是從別人的地盤倒騰數(shù)據(jù)，而且內(nèi)容還是腳本！也就是說如果人家是個壞人，給你點惡意代碼，那就不好辦了。
當(dāng)然這個問題一般也不會發(fā)生。畢竟咱想請求數(shù)據(jù)的地方都是咱熟悉的要么就是官方的(什么谷歌地圖API，新浪微博API這些顯然不會給你坑)。
另一個問題就鬧心了。瀏覽器端對JSONP的請求是否失敗是無法直接知曉的。就算用jQuery，error也不起作用。就算出錯了try,catch也捕捉不到。
所以暫時知道的只有一種不完美方法，就是設(shè)定一個時限，如果超過時限還沒有數(shù)據(jù)返回，那么就判定error。說不完美是因為，各家的網(wǎng)速是不同的，所以...你懂得。
--------------------------------------------------------------------------------
jQuery中contentType相關(guān)
jQuery官網(wǎng)原文
復(fù)制代碼 代碼如下:m.ghpqjb.com
contentType
Default: 'application/x-www-form-urlencoded; charset=UTF-8'
When sending data to the server, use this content type.
Default is "application/x-www-form-urlencoded; charset=UTF-8", which is fine for most cases.
If you explicitly pass in a content-type to $.ajax(),
then it'll always be sent to the server (even if no data is sent).
If no charset is specified, data will be transmitted to the server using the server's default charset;
you must decode this appropriately on the server side.
通過這段文字我們就可以知道在jQuery ajax中 contentType默認是'application/x-www-form-urlencoded; charset=UTF-8' 當(dāng)然這是最新版jQuery的。相對于以前版本是有些許變化的。
如果想將一個對象序列化后傳向后臺，可以將contentType設(shè)置為'application/json'
分享：JQuery的ajax的用法在asp中使用$.ajax()實現(xiàn)ajax的出現(xiàn)解決了很多的疑難問題，同時帶來了很多的方便,本文講述一下JQuery的ajax的用法在asp中使用$.ajax()來表示，感興趣的朋友可以了解下，或許本文對你有所幫助
相關(guān)AJAX教程：
- Ajax中瀏覽器的緩存問題解決方法
- AJAX和WebService實現(xiàn)省市縣三級聯(lián)動具體代碼
- ajax 登錄功能簡單實現(xiàn)(未連接數(shù)據(jù)庫)
- AJAX和WebService實現(xiàn)郵箱驗證(無刷新驗證郵件地址是否合法)
- AJAX和三層架構(gòu)實現(xiàn)分頁功能具體思路及代碼
- 使用AJAX返回WebService里的集合具體實現(xiàn)
- AJAX獲取服務(wù)器當(dāng)前時間及時間格式輸出處理
- ajax傳遞多個參數(shù)具體實現(xiàn)
- ajax傳遞一個參數(shù)具體實現(xiàn)
- 滑輪滾動到頁面底部ajax加載數(shù)據(jù)配合jsonp實現(xiàn)探討
- jQery ajax——load()方法示例介紹
- jQuery+Ajax實現(xiàn)表格數(shù)據(jù)不同列標(biāo)題排序(為表格注入活力)
AJAX教程Rss訂閱編程教程搜索
AJAX教程推薦
- jQuery Ajax使用心得詳細整理及注意事項
- 淺析AJAX實例：動態(tài)進度條
- Ajax標(biāo)簽導(dǎo)航實例詳解-Javascript技巧篇
- 在AJAX開發(fā)中集成數(shù)據(jù)庫技術(shù)
- AJAX教程之AJAX的jQuery實現(xiàn)入門(二)
- Ajax實現(xiàn)靜態(tài)刷新頁面過程帶加載旋轉(zhuǎn)圖片
- ajax傳遞一個參數(shù)具體實現(xiàn)
- 怎樣學(xué)習(xí)AJAX
- Ajax中瀏覽器的緩存問題解決方法
- 菜鳥蔡之Ajax復(fù)習(xí)第一篇(后臺asp.net)(傳統(tǒng)的JavaScript方法實現(xiàn)Ajax功能)
- 相關(guān)鏈接：
- 教程說明：
AJAX教程-jQuery Ajax使用心得詳細整理及注意事項
。