如果綁定給window對(duì)象,則會(huì)在所有內(nèi)容加載后觸發(fā),包括窗口,框架,對(duì)象和圖像。如果綁定在元素上,則當(dāng)元素的內(nèi)容加載完畢后觸發(fā)。
創(chuàng)新互聯(lián)公司客戶idc服務(wù)中心,提供成都服務(wù)器托管、成都服務(wù)器、成都主機(jī)托管、成都雙線服務(wù)器等業(yè)務(wù)的一站式服務(wù)。通過各地的服務(wù)中心,我們向成都用戶提供優(yōu)質(zhì)廉價(jià)的產(chǎn)品以及開放、透明、穩(wěn)定、高性價(jià)比的服務(wù),資深網(wǎng)絡(luò)工程師在機(jī)房提供7*24小時(shí)標(biāo)準(zhǔn)級(jí)技術(shù)保障。
注意:只有當(dāng)在這個(gè)元素完全加載完之前綁定load的處理函數(shù),才會(huì)在他加載完后觸發(fā)。如果之后再綁定就永遠(yuǎn)不會(huì)觸發(fā)了。所以不要在$(document).ready()里綁定load事件,因?yàn)閖Query會(huì)在所有DOM加載完成后再綁定load事件。因此,使用load方法時(shí)盡量把load方法寫在頁面頂部。
調(diào)用load方法的完整格式是:load(
url,
[data],
[callback]
),
其中:
?url:是指要導(dǎo)入文件的地址。
?data:可選參數(shù);因?yàn)長(zhǎng)oad不僅僅可以導(dǎo)入靜態(tài)的html文件,還可以導(dǎo)入動(dòng)態(tài)腳本,例如PHP文件,所以要導(dǎo)入的是動(dòng)態(tài)文件時(shí),我們可以把要傳遞的參數(shù)放在這里。
?callback:可選參數(shù);是指調(diào)用load方法并得到服務(wù)器響應(yīng)后,再執(zhí)行的另外一個(gè)函數(shù)。
一:如何使用data
1.加載一個(gè)php文件,該php文件不含傳遞參數(shù)$("#myID").load("test.php");
//在id為#myID的元素里導(dǎo)入test.php運(yùn)行后的結(jié)果2.
加載一個(gè)php文件,該php文件含有一個(gè)傳遞參數(shù)
$("#myID").load("test.php",{"name"
:
"Adam"});
//導(dǎo)入的php文件含有一個(gè)傳遞參數(shù),類似于:test.php?name=Adam3.
加載一個(gè)php文件,該php文件含有多個(gè)傳遞參數(shù)。注:參數(shù)間用逗號(hào)分隔
$("#myID").load("test.php",{"name"
:
"Adam"
,"site":"61dh.com"});
//導(dǎo)入的php文件含有一個(gè)傳遞參數(shù),類似于:test.php?name=Adamsite=61dh.com4.
加載一個(gè)php文件,該php文件以數(shù)組作為傳遞參數(shù)
$("#myID").load("test.php",{'myinfo[]',
["Adam",
"61dh.com"]});
//導(dǎo)入的php文件含有一個(gè)數(shù)組傳遞參數(shù)。注意:使用load,這些參數(shù)是以POST的方式傳遞的,因此在test.php里,不能用GET來獲取參數(shù)。
二:如何使用callback
比如我們要在load方法得到服務(wù)器響應(yīng)后,慢慢地顯示加載的內(nèi)容,就可以使用callback函數(shù)。代碼如下:
復(fù)制代碼
代碼如下:
$("#go").click(function(){
$("#myID").load("welcome.php",
{"lname"
:
"Cai",
"fname"
:
"Adam",
function(){
$("#myID").fadeIn('slow');}
);
});
備注:
在load的url里加上空格后面就可以跟選擇器了。
例如:
復(fù)制代碼
代碼如下:
$("body").load("test.html
#a");
jquery load方法用法詳解
1.load定義和用法,load() 方法通過 AJAX 請(qǐng)求從服務(wù)器加載數(shù)據(jù),并把返回的數(shù)據(jù)放置到指定的元素中。jquery load是jquery ajax中的一種功能,load可以方便快速的直接加載一個(gè)頁面到指定div中(html,php),并且它可以帶參數(shù)。
2.還存在一個(gè)名為 load 的 jQuery 事件方法。調(diào)用哪個(gè),取決于參數(shù)。
下面是幾個(gè)例子:
1).加載一個(gè)php文件,該php文件不含傳遞參數(shù)
$("#myID").load("test.php");
2).加載一個(gè)php文件,該php文件含有一個(gè)傳遞參數(shù)
$("#myID").load("test.php",{"name"?:?"Adam"});
//導(dǎo)入的php文件含有一個(gè)傳遞參數(shù),類似于:test.php?name=Adam
或者直接
$("#divResult").load("jqueryLoad?username="?+?username?+?"un="+$("#username").val()+"timestamp="?+?(new?Date()).getTime());
3).使用 AJAX 請(qǐng)求來改變 div 元素的文本
$("button").click(function(){
$("div").load('demo_ajax_load.txt');
});
jquery的load把返回的數(shù)據(jù)放到指定的元素中,不是全局函數(shù);
jquery的get把返回的數(shù)據(jù)交給用戶處理,是全局函數(shù)。
load和get同樣是jquery的ajax函數(shù),load的實(shí)現(xiàn),幾乎等于get之后再設(shè)置網(wǎng)頁元素,在ajax獲取機(jī)制上沒有區(qū)別,但要注意的是,load方法另一個(gè)和get的重要區(qū)別,就是load允許指定要插入的遠(yuǎn)程文檔的某個(gè)部分,比如:
$("#result").load("test.html #page2");
load是最簡(jiǎn)單的ajax加載局部網(wǎng)頁的方法,但有局限性(只能替換元素內(nèi)容),get也是jquery中比較簡(jiǎn)單的方法,兩者的安全級(jí)別較低。如果有傳送密碼和其它重要數(shù)據(jù)信息,推薦使用post方法。
是這樣的,如果不過濾掉一些內(nèi)容的話,直接加載,會(huì)使頁面混亂的,比如新的頁面也存在body標(biāo)簽,加載進(jìn)來后,一個(gè)頁面就會(huì)存在兩個(gè)body標(biāo)簽是不規(guī)范的的HTML。這個(gè)是在jquery.load()函數(shù)中規(guī)定的。一般加載進(jìn)來的頁面需要自己根據(jù)加載的內(nèi)容的元素重新定義CSS樣式和添加js事件的。比如:
原頁面A.html:
html
headtitle/title/head
body
div id="container"/div
/body/html
被load的頁面B.html:
html
headtitle/title/head
style.page-li {font-size:12px;color:blue}/style
body
div id="page"
ol class="page-li"
li234123/lili341234/lili41234/lili412de34/li
/ol
/div
/body/html
在原頁面A.html中加載調(diào)用的jquery.load(),然后再在原頁面對(duì) page-li 的樣式重新定義下就可以了:
添加了load(),css的原頁面:
html
headtitle/title/head
style.page-li {font-size:12px;color:green}/style
body
div id="container"/div
script type="text/javascript"
$(function(){
$("#container").load("B.html #page",null,function(){alert("加載成功")});
});
/script
/body/html
原頁面A.html:
html
headtitle/title/head
body
div id="container"/div
/body/html
被load的頁面B.html:
html
headtitle/title/head
style.page-li {font-size:12px;color:blue}/style
body
div id="page"
ol class="page-li"
li234123/lili341234/lili41234/lili412de34/li
/ol
/div
/body/html
在原頁面A.html中加載調(diào)用的jquery.load(),然后再在原頁面對(duì) page-li 的樣式重新定義下就可以了:
添加了load(),css的原頁面:
html
headtitle/title/head
style.page-li {font-size:12px;color:green}/style
body
div id="container"/div
script type="text/javascript"
$(function(){
$("#container").load("B.html #page",null,function(){alert("加載成功")});
});
/script
/body/html
以?POST?形式發(fā)送附加參數(shù)并在成功時(shí)顯示信息。
$usr?=?$('#usr1').prop('value');
$pwd?=?$('#pwd1').prop('value');
$("#feeds").load("test1.php",?{usr:?$usr,?pwd:?$pwd},?function(){
alert("username?and?password?send?!");
});