本文實(shí)例講述了jQuery中ajax的load()方法用法。分享給大家供大家參考。具體分析如下：
此函數(shù)jQuery中簡(jiǎn)單而功能強(qiáng)大的ajax方法。
它可以從服務(wù)器加載內(nèi)容，然后寫(xiě)入匹配元素。
語(yǔ)法結(jié)構(gòu):
參數(shù)解析:
1.selector:一個(gè)選擇器，可以將內(nèi)容加載到此選擇器匹配的元素中。
2.URL:必須，需要加載的一個(gè)url地址。
3.data:可選，與請(qǐng)求一同發(fā)送的查詢字符串鍵/值對(duì)集合。
4.callback:可選，load()函數(shù)執(zhí)行完畢后要執(zhí)行的函數(shù)，也即是一個(gè)回調(diào)函數(shù)。
代碼實(shí)例:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.survivalescaperooms.com/" />
<title>武林網(wǎng)</title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#bt").click(function(){
$("#thediv").load("mytest/demo/antzone.txt");
})
})
</script>
</head>
<body>
<div id="thediv"></div>
<input type="button" value="查看效果" id="bt"/>
</body>
</html>
以上代碼實(shí)現(xiàn)了我們的要求，可以將文本文件中的內(nèi)容寫(xiě)入div元素中。
callback回調(diào)函數(shù):
回調(diào)函數(shù)可以具有三個(gè)參數(shù)，下面介紹一下三個(gè)參數(shù)的作用:
1.responseTxt:包含調(diào)用成功時(shí)的結(jié)果內(nèi)容。
2.statusTXT:包含調(diào)用的狀態(tài)。
3.xhr:XMLHttpRequest對(duì)象。
代碼實(shí)例:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.survivalescaperooms.com/" />
<title>武林網(wǎng)</title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#bt").click(function(){
$("#thediv").load("antzone.txt",function(responseTxt,statusTxt,xhr){
if(statusTxt=="success"){
alert("內(nèi)容加載成功！");
}
if(statusTxt=="error"){
alert("錯(cuò)誤:"+xhr.status+":"+xhr.statusText);
}
});
});
})
</script>
</head>
<body>
<div id="thediv"></div>
<input type="button" value="查看效果" id="bt"/>
</body>
</html>
以上代碼實(shí)現(xiàn)可以彈出錯(cuò)誤提示，因?yàn)槁窂讲徽_，找不到文件。
希望本文所述對(duì)大家的jQuery程序設(shè)計(jì)有所幫助。
