jQuery ajax用法與ajax學習筆記

.$.post(url, params, callback) 用post的方式下載一個頁面返回XMLHttpRequest

url: 請求的頁面

params:表示請求的要發送的參數.

callback: 請求結束後,調用的方法

eg:

代碼如下	複製代碼
$.post("test.cgi", { name: "John", time: "2pm" }, function(data){ alert("Data Loaded: " + data); } );

ajaxStart(callback) 當ajax請求發送前,將觸發callback.

eg;

代碼如下	複製代碼
$("#loading").ajaxStart(function(){   $(this).show(); });

ajaxSend(callback)當ajax請求發送時觸發callback,參數是XMLHttpRequest和settings請求設定eg:

代碼如下	複製代碼
$("#msg").ajaxSend(function(request, settings){   $(this).append("<li>Starting request at " + settings.url + "</li>"); });

ajaxComplete(callback)當一個ajax請求完成時調用callback.回調參數為XMLHttpRequest和settings請求設定eg:

代碼如下	複製代碼
$("#msg").ajaxComplete(function(request, settings){   $(this).append("<li>Request Complete.</li>"); });

ajaxSuccess(callback)當一個ajax請求成功時調用回調參數為XMLHttpRequest和settings請求設定eg:

代碼如下	複製代碼
$("#msg").ajaxSuccess(function(request, settings){   $(this).append("<li>Successful Request!</li>"); });

ajaxError(callback)當一個ajax請求失敗時調用回調參數為XMLHttpRequest和settings請求設定eg:

代碼如下	複製代碼
$("#msg").ajaxError(function(request, settings){   $(this).append("<li>Error requesting page " + settings.url + "</li>"); });

ajaxStop(callback)當所有的ajax請求結束時,將觸發callback

eg:

代碼如下	複製代碼
$("#loading").ajaxStop(function(){   $(this).hide(); });

load(url, params, callback)載入url的內容,並把得到的內容插入到DOM中去. 注意:避免去擷取script指令碼.可以用$.getScripturl:請求的頁面,params:發送的參數.callback: 調用完成後的回呼函數.eg:

代碼如下	複製代碼
<div id="feeds"></div>$("#feeds").load("feeds.html")==><div id="feeds"><b>45</b> feeds found.</div>;

loadIfModified(url, params,callback)功能與85點的load方法一模一樣.唯一的區別是,當伺服器端根據LastModify判斷出沒有什麼改動的話.就不進行請求.也不進行dom插入.

serialize()這是一個十分有用的方法.一般用來序列化進行ajax請求的參數.十分方便eg

代碼如下	複製代碼
:<input type='text' name='name' value='John'/> <input type='text' name='location' value='Boston'/>$("input[@type=text]").serialize();==>name=John&location=Boston

.$.ajax(params)這個方法是jQuery中調用ajax的最基本方法,功能十分強大.參數是一個對象.所有的參數用key:value的形式設定

下面主要介紹一下各種參數:

(string)url: 要請求的網址,可以把參數get參數設定到url上面

(string)type: 請求的類型,可以是Post與get,預設情況下是GET

(string)dataType: 你所期望返回的資料格式,可以是xml,html,script,json.最終傳回型別還是伺服器決定.

(Boolean)ifModified:只當傳回值改變的時候才會成功返回正確值.主要判斷依據是要求標頭的Last-Modified.預設情況下,這個值設定為false

(Number)timeout:佈建要求時間,這個時間會替換全域的時間($.ajaxTimeout)

(Boolean)global:是否觸發全域的ajax事件控制代碼.例如ajaxStart,ajaxStop.預設情況是true

(Function)error: 請求錯誤處理的函數.

(Function)success: 請求成功處理的函數.

(Function)complete:請求完成處理的函數.

(Object|string)data:發送到伺服器端的資料.如果不是字串,則被轉化成字串,被加到url上面,做為查詢字串.如果不想用預設的方式處理,可以設定processData狀態.

(Boolean)processData.預設情況是true,把object轉化成string,做查詢字串.可以設定為false,則以DOMDocments發送.

(String)contentType.預設是"application/x-www-form-urlencoded",一般情況不用修改.

(Boolean)async .預設值為true.表示非同步請求,如果想改成同步.只要把設為false就可以了.

(Function)beforeSend.用於對在發送請求之前,對要求標頭的設定.有XMLHttpRequest做為參數

例子:

取一個js檔案.

代碼如下	複製代碼
$.ajax({   type: "GET",   url: "test.js",   dataType: "script" })

post資料到伺服器端,並且成功時提示使用者.

代碼如下	複製代碼
$.ajax({   type: "POST",   url: "some.php",   data: "name=John&location=Boston",   success: function(msg){     alert( "Data Saved: " + msg );   } });

同步請求資料

代碼如下	複製代碼
var html = $.ajax({  url: "some.php",  async: false })

.responseText;傳送domdocument,data將不會被強行轉化.var xmlDocument = [create xml document];

代碼如下	複製代碼
$.ajax({   url: "page.php",   processData: false,   data: xmlDocument,   success: handleResponse });

$.ajaxSetup(settings)設定一個全域的ajax變數.一般用來設定一些公用的要求標頭設定.

代碼如下	複製代碼
$.ajaxSetup( {   url: "/xmlhttp/",   global: false,   type: "POST" } ); $.ajax({ data: myData });

$.ajaxTimeout(time) 設定全域ajax請求時間,當time為0或者null時表示不限時間$.ajaxTimeout( 5000 ); //表示最長5秒請求.

$.get(url, params, callback)下載一個頁面.url:頁面地址,params: 參數,是key/value的mapcallback: 請求結束後調用的方法eg:

代碼如下	複製代碼
$.get("test.cgi",   { name: "John", time: "2pm" },   function(data){     alert("Data Loaded: " + data);   } );

$.getIfModified(url, params, callback)與get一樣,不同之處在於如果請求的頁面傳回值不變的話,就不處理請求.

代碼如下	複製代碼
$.getJSON(url, params,callback)與$.get一樣,傳回值是用json格式後好的. $.getScript(url, callback)下載指令檔,並運行.eg:$.getScript("test.js", function(){   alert("Script loaded and executed."); });