最新的Web開發教程
 

jQuery - AJAX load() Method


jQuery的load()方法

jQuery的load()方法是一種簡單,但功能強大的AJAX方法。

load()從服務器方法負荷數據,並把該返回的數據到所選擇的元件。

句法:

$(selector).load(URL,data,callback);

所需的URL參數指定要加載的URL。

可選的數據參數指定了一組querystring鍵/值對與請求一起發送。

可選的回調參數是之後要執行的功能的名稱load()完成方法。

下面是我們的示例文件的內容: "demo_test.txt"

<h2>jQuery and AJAX is FUN!!!</h2>
<p id="p1">This is some text in a paragraph.</p>

下面的例子加載文件的內容"demo_test.txt"到一個特定<div>元素:

$("#div1").load("demo_test.txt");
試一試»

另外,也可以對一個jQuery選擇添加到URL參數。

下面的示例加載與元素的內容id="p1"裡面的文件"demo_test.txt"到特定<div>元素:

$("#div1").load("demo_test.txt #p1");
試一試»

可選的回調參數指定一個回調函數時運行load()完成方法。 回調函數可以有不同的參數:

  • responseTxt -包含得到的內容,如果調用成功
  • statusTxt -包含該呼叫的狀態
  • xhr -包含XMLHttpRequest對象

下面的例子後會顯示一個警告框load()方法完成。 如果load()方法成功,則顯示"External content loaded successfully!"如果失敗就顯示錯誤消息:

$("button").click(function(){
    $("#div1").load("demo_test.txt", function(responseTxt, statusTxt, xhr){
        if(statusTxt == "success")
            alert("External content loaded successfully!");
        if(statusTxt == "error")
            alert("Error: " + xhr.status + ": " + xhr.statusText);
    });
});
試一試»

jQuery的AJAX參考

對於所有的jQuery AJAX方法的完整概述,請訪問我們的jQuery AJAX參考