jquery load事件(callback/data)使用方法及注意事項(xiàng)

如果綁定給window對(duì)象，則會(huì)在所有內(nèi)容加載后觸發(fā)，包括窗口，框架，對(duì)象和圖像。如果綁定在元素上，則當(dāng)元素的內(nèi)容加載完畢后觸發(fā)。

創(chuàng)新互聯(lián)堅(jiān)持“要么做到，要么別承諾”的工作理念，服務(wù)領(lǐng)域包括：成都網(wǎng)站設(shè)計(jì)、做網(wǎng)站、企業(yè)官網(wǎng)、英文網(wǎng)站、手機(jī)端網(wǎng)站、網(wǎng)站推廣等服務(wù)，滿足客戶于互聯(lián)網(wǎng)時(shí)代的蓋州網(wǎng)站設(shè)計(jì)、移動(dòng)媒體設(shè)計(jì)的需求，幫助企業(yè)找到有效的互聯(lián)網(wǎng)解決方案。努力成為您成熟可靠的網(wǎng)絡(luò)建設(shè)合作伙伴！

注意:只有當(dāng)在這個(gè)元素完全加載完之前綁定load的處理函數(shù),才會(huì)在他加載完后觸發(fā)。如果之后再綁定就永遠(yuǎn)不會(huì)觸發(fā)了。所以不要在$(document).ready()里綁定load事件，因?yàn)閖Query會(huì)在所有DOM加載完成后再綁定load事件。因此，使用load方法時(shí)盡量把load方法寫在頁(yè)面頂部。

調(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來(lái)獲取參數(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");

頁(yè)面用jquery的load()方法加載新頁(yè)面之后怎么返回上一頁(yè)

原頁(yè)面A.html：

html

headtitle/title/head

body

div id="container"/div

/body/html

被load的頁(yè)面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

在原頁(yè)面A.html中加載調(diào)用的jquery.load()，然后再在原頁(yè)面對(duì) page-li 的樣式重新定義下就可以了：

添加了load(),css的原頁(yè)面：

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

jQuery load方法

以?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?!");

});

jquery.load 和 append 同時(shí)使用上的區(qū)別

jQuery 事件 - load() 方法

當(dāng)指定的元素（及子元素）已加載時(shí)，會(huì)發(fā)生 load() 事件。

實(shí)例

當(dāng)圖像加載時(shí)，改變 div 元素的文本：

$("img").load(function(){

$("div").text("Image loaded");

});

append() 方法

append() 方法在被選元素的結(jié)尾（仍然在內(nèi)部）插入指定內(nèi)容。

提示：append() 和 appendTo() 方法執(zhí)行的任務(wù)相同。不同之處在于：內(nèi)容的位置和選擇器。

實(shí)例

在每個(gè) p 元素結(jié)尾插入內(nèi)容：

$("button").click(function(){

$("p").append(" bHello world!/b");

});

應(yīng)用實(shí)例

//更多文章

var url='/ajaxArchive.php?page=1';

$("#archivePlaceHold").load(url);

jQuery.load()只能替換掉元素中的內(nèi)容。

jQuery.load()不能同時(shí)使用append，需要使用 jQuery.get()實(shí)現(xiàn)

var url='/ajaxArchive.php?page=1';

$.get(url, function(data){

$(data).appendTo("#archivePlaceHold");

});

jquery的load和get的區(qū)別

jquery的load把返回的數(shù)據(jù)放到指定的元素中，不是全局函數(shù)；

jquery的get把返回的數(shù)據(jù)交給用戶處理，是全局函數(shù)。

load和get同樣是jquery的ajax函數(shù)，load的實(shí)現(xiàn)，幾乎等于get之后再設(shè)置網(wǎng)頁(yè)元素，在ajax獲取機(jī)制上沒有區(qū)別，但要注意的是，load方法另一個(gè)和get的重要區(qū)別，就是load允許指定要插入的遠(yuǎn)程文檔的某個(gè)部分，比如：

$("#result").load("test.html #page2");

load是最簡(jiǎn)單的ajax加載局部網(wǎng)頁(yè)的方法，但有局限性（只能替換元素內(nèi)容），get也是jquery中比較簡(jiǎn)單的方法，兩者的安全級(jí)別較低。如果有傳送密碼和其它重要數(shù)據(jù)信息，推薦使用post方法。

新聞名稱：jquery的load方法,jquery load加載頁(yè)面
網(wǎng)頁(yè)鏈接：http://chinadenli.net/article18/dsiphgp.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站維護(hù)、企業(yè)網(wǎng)站制作、靜態(tài)網(wǎng)站、定制開發(fā)、搜索引擎優(yōu)化、網(wǎng)站收錄

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)