jQuery 使用手冊(七)
更新時間:2009年09月23日 17:33:06 作者:
jQuery 使用手冊,大家可以耐心的看完,就基本上入門了。
七:Ajax支持
通用方式:
$.ajax(prop) 通過一個ajax請求,回去遠程數據,prop是一個hash表,它可以傳遞的key/value有以下幾種。
(String)type:數據傳遞方式(get或post)。
((String)url:數據請求頁面的url
((String)data:傳遞數據的參數字符串,只適合post方式
((String)dataType:期待數據返回的數據格式(例如 "xml", "html", "script",或 "json")
((Boolean)ifModified: 當最后一次請求的相應有變化是才成功返回,默認值是false
((Number)timeout:設置時間延遲請求的時間??梢詤⒖?.ajaxTimeout
((Boolean)global:是否為當前請求觸發(fā)ajax全局事件,默認為true
((Function)error:當請求失敗時觸發(fā)的函數。
((Function)success:當請求成功時觸發(fā)函數
((Function)complete:當請求完成后出發(fā)函數
jQuery代碼及說明
$.getJSON(url, params, callback) 用get方式向遠程json對象傳遞參數,請求完成后處理函數callback。
$.getScript(url, callback) 用get方式載入并運行一個遠程javascript文件。請求完成后處理函數callback。
$.post(url, params, callback) 用post方式向遠程頁面?zhèn)鬟f參數,請求完成后處理函數callback
load(url, params, callback) 載入一個遠程文件并載入頁面DOM中,并執(zhí)行函數callback
loadIfModified(url, params, callback) 用get方式向遠程頁面?zhèn)鬟f參數,從最后一次請求后如果數據有變化才作出響應,將返回結果載入頁面DOM中,并執(zhí)行函數callback
ajaxStart(callback) 當ajax請求發(fā)生錯誤是時執(zhí)行函數callback
ajaxComplete(callback) 當ajax請求完成時執(zhí)行函數callback
ajaxError(callback) 當ajax請求發(fā)生錯誤時執(zhí)行函數callback
ajaxStop(callback) 當ajax請求停止時執(zhí)行函數callback
ajaxSuccess(callback) 當ajax請求成功時執(zhí)行函數callback
結束:jQuery插件
隨著jQuery的廣泛使用,已經出現了大量jQuery插件,如thickbox,iFX,jQuery-googleMap等,簡單的引用這些源文件就可以方便的使用這些插件。這里我簡單的介紹一些網址供大家參考,這些網站頭提供了大量的demo,并且使用及其簡單,及時E文不好,也能快速掌握!
http://jquery.com/plugins 官方推薦
http://interface.eyecon.ro/demos 效果超級棒,使用更簡單,一定有你喜歡的!
http://www.dyve.net/jquery/
http://bassistance.de/jquery-plugins
通用方式:
$.ajax(prop) 通過一個ajax請求,回去遠程數據,prop是一個hash表,它可以傳遞的key/value有以下幾種。
(String)type:數據傳遞方式(get或post)。
((String)url:數據請求頁面的url
((String)data:傳遞數據的參數字符串,只適合post方式
((String)dataType:期待數據返回的數據格式(例如 "xml", "html", "script",或 "json")
((Boolean)ifModified: 當最后一次請求的相應有變化是才成功返回,默認值是false
((Number)timeout:設置時間延遲請求的時間??梢詤⒖?.ajaxTimeout
((Boolean)global:是否為當前請求觸發(fā)ajax全局事件,默認為true
((Function)error:當請求失敗時觸發(fā)的函數。
((Function)success:當請求成功時觸發(fā)函數
((Function)complete:當請求完成后出發(fā)函數
jQuery代碼及說明
$.ajax({url: "ajax.htm",
success:function(msg){
$(div"#a").html(msg);
}
});
將ajax.htm返回的內容作為id為a的div內容
success:function(msg){
$(div"#a").html(msg);
}
});
$.ajax({ url: "ajax.aspx",
type:"get",
dataType:"html",
data: "name=John&location=Boston",
success:function(msg){
$("#a").html(msg);
}
});
type:"get",
dataType:"html",
data: "name=John&location=Boston",
success:function(msg){
$("#a").html(msg);
}
});
用get方式向ajax.aspx頁面?zhèn)鲄担⒎祷貎热葚摻oid為a的對象。
$.ajaxTimeout(time) 設置請求結束時間
$.ajaxTimeout( 5000 )
其它簡化方式:
$.get(url, params, callback) 用get方式向遠程頁面?zhèn)鬟f參數,請求完成后處理函數,除了url外,其它參數任意選擇!
$.get( "ajax.htm" , function(data){ $("#a").html(data) })
$.get( "ajax.asp",
{ name: "young", age: "25" },
function(data){ alert("Data Loaded: " + data); }
)
$.getIfModified(url, params, callback) 用get方式向遠程頁面?zhèn)鬟f參數,從最后一次請求后如果數據有變化才作出響應,執(zhí)行函數callback{ name: "young", age: "25" },
function(data){ alert("Data Loaded: " + data); }
)
$.getJSON(url, params, callback) 用get方式向遠程json對象傳遞參數,請求完成后處理函數callback。
$.getScript(url, callback) 用get方式載入并運行一個遠程javascript文件。請求完成后處理函數callback。
$.post(url, params, callback) 用post方式向遠程頁面?zhèn)鬟f參數,請求完成后處理函數callback
load(url, params, callback) 載入一個遠程文件并載入頁面DOM中,并執(zhí)行函數callback
$("#a").load("ajax.htm", function() { alert("load is done"); } );
仰天一笑 徐羽 向ajax.htm頁面發(fā)出請求,將返回結果裝入id為a的內容中,然后再執(zhí)行函數callback。loadIfModified(url, params, callback) 用get方式向遠程頁面?zhèn)鬟f參數,從最后一次請求后如果數據有變化才作出響應,將返回結果載入頁面DOM中,并執(zhí)行函數callback
ajaxStart(callback) 當ajax請求發(fā)生錯誤是時執(zhí)行函數callback
ajaxComplete(callback) 當ajax請求完成時執(zhí)行函數callback
ajaxError(callback) 當ajax請求發(fā)生錯誤時執(zhí)行函數callback
ajaxStop(callback) 當ajax請求停止時執(zhí)行函數callback
ajaxSuccess(callback) 當ajax請求成功時執(zhí)行函數callback
結束:jQuery插件
隨著jQuery的廣泛使用,已經出現了大量jQuery插件,如thickbox,iFX,jQuery-googleMap等,簡單的引用這些源文件就可以方便的使用這些插件。這里我簡單的介紹一些網址供大家參考,這些網站頭提供了大量的demo,并且使用及其簡單,及時E文不好,也能快速掌握!
http://jquery.com/plugins 官方推薦
http://interface.eyecon.ro/demos 效果超級棒,使用更簡單,一定有你喜歡的!
http://www.dyve.net/jquery/
http://bassistance.de/jquery-plugins
相關文章
jQuery動態(tài)移除與增加onclick屬性的方法詳解
這篇文章主要介紹了jQuery動態(tài)移除與增加onclick屬性的方法,結合實例形式分析了jQuery使用attr與removeAttr方法針對元素屬性動態(tài)操作相關實現技巧,需要的朋友可以參考下2018-06-06jquery+ajaxform+springboot控件實現數據更新功能
這篇文章主要介紹了jquery+ajaxform+springboot控件實現數據更新操作,使用jquery的ajaxform插件是一個比較不錯的選擇。具體實現工程大家參考下本文2018-01-01