jQuery - Phương thức AJAX load ()
Phương thức jQuery load ()
Phương thức jQuery load()là một phương thức AJAX đơn giản nhưng mạnh mẽ.
Phương load()thức này tải dữ liệu từ máy chủ và đưa dữ liệu trả về vào phần tử đã chọn.
Cú pháp:
$(selector).load(URL,data,callback);
Tham số URL bắt buộc chỉ định URL bạn muốn tải.
Tham số dữ liệu tùy chọn chỉ định một tập hợp các cặp khóa / giá trị chuỗi truy vấn để gửi cùng với yêu cầu.
Tham số gọi lại tùy chọn là tên của một hàm sẽ được thực thi sau khi load()phương thức được hoàn thành.
Đây là nội dung của tệp ví dụ của chúng tôi: "demo_test.txt":
<h2>jQuery and AJAX is FUN!!!</h2>
<p id="p1">This is some text in a paragraph.</p>
Ví dụ sau tải nội dung của tệp "demo_test.txt" vào một <div>phần tử cụ thể:
Thí dụ
$("#div1").load("demo_test.txt");
Cũng có thể thêm bộ chọn jQuery vào tham số URL.
Ví dụ sau tải nội dung của phần tử có id = "p1", bên trong tệp "demo_test.txt", vào một <div>phần tử cụ thể:
Thí dụ
$("#div1").load("demo_test.txt #p1");
Tham số gọi lại tùy chọn chỉ định một hàm gọi lại để chạy khi
load()phương thức được hoàn thành. Hàm gọi lại có thể có các tham số khác nhau:
responseTxt- chứa nội dung kết quả nếu cuộc gọi thành côngstatusTxt- chứa trạng thái của cuộc gọixhr- chứa đối tượng XMLHttpRequest
Ví dụ sau sẽ hiển thị một hộp cảnh báo sau khi phương thức load () hoàn tất. Nếu load()phương pháp đã thành công, nó sẽ hiển thị "Nội dung bên ngoài đã được tải thành công!" Và nếu không thành công, nó sẽ hiển thị thông báo lỗi:
Thí dụ
$("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);
});
});
Tham chiếu jQuery AJAX
Để có cái nhìn tổng quan đầy đủ về tất cả các phương thức jQuery AJAX, vui lòng truy cập Tài liệu tham khảo jQuery AJAX của chúng tôi .