jQuery ajax - load() 方法
实例
使用 AJAX 请求来改变 div 元素的文本：
$("button").click(function(){
$("div").load('demo_ajax_load.txt');
});
定义和用法
load() 方法通过 AJAX 请求从服务器加载数据，并把返回的数据放置到指定的元素中。
Catatan:还存在一个名为 load 的 jQuery 事件方法。调用哪个，取决于参数。
语法
load(url,data,function(response,status,xhr))
| 参数 | �述 |
|---|---|
| url | Tentukan URL mana permintaan akan dikirimkan. |
| data | Pilihan. Data yang akan dikirim ke server bersama permintaan. |
| function(response,status,xhr) |
Pilihan. Fungsi yang akan dijalankan saat permintaan selesai. Parameter ekstra:
|
Penjelasan detil
Metode ini adalah metode paling sederhana untuk mendapatkan data dari server. Hal ini hampir setara dengan $.get(url, data, success), tetapi berbeda adalah ia bukan fungsi global, dan ia memiliki balik fungsi yang diam. Saat mendeteksi tanggap yang sukses (misalnya, saat textStatus adalah "success" atau "notmodified"), .load() akan menyetel kandungan HTML elemen yang disesuaikan dengan data yang dipulangkan. Ini berarti sebagian besar penggunaan metode ini akan sangat sederhana:
$("#result").load("ajax/test.html");
Jika disediakan fungsi balik, fungsi ini akan dijalankan setelah post-processing dilakukan:
$("#result").load("ajax/test.html", function() {
alert("Load was performed.");
});
Dalam dua contoh di atas, jika dokumen saat ini tidak mengandung "result" ID, maka metode .load() tidak akan dijalankan.
Jika data yang disediakan adalah objek, maka gunakan metode POST; jika tidak, gunakan metode GET.
Muat bagian halaman
Metode .load(), berbeda dengan $.get(), memungkinkan kami untuk menentukan bagian dokumen jarak jauh yang akan disisipkan. Ini disediakan melalui sintaks parameter url khusus. Jika string ini mengandung satu atau lebih spasi, string yang mengikuti spasi pertama adalah pemilihan jQuery yang menentukan kandungan yang diambil.
Kami dapat mengubah contoh di atas supaya dapat menggunakan bagian yang diambil dokumen yang diambil:
$("#result").load("ajax/test.html #container");
Jika menjalankan metode ini, maka akan mengambil kandungan ajax/test.html, tetapi kemudian, jQuery akan mengurai dokumen yang dipulangkan untuk mencari elemen dengan ID kontainer. Elemen ini, bersama dengan kandungannya, akan disisipkan ke dalam elemen dengan ID hasil, sebagian besar bagian dokumen yang dipulangkan akan diabaikan.
jQuery menggunakan sifat .innerHTML pelayar untuk mengurai dokumen yang diambil dan memasukkannya ke dokumen semasa. Dalam proses ini, pelayar sering menghalang elemen seperti <html>, <title> atau <head> elemen. Sebagai akibatnya, elemen yang diambil kembali oleh .load() mungkin tidak sama sepenuhnya dengan dokumen yang diambil secara langsung oleh pelayar.
Catatan:Disebabkan hadbat keamanan pelayar, kebanyakan permintaan "Ajax" mengikuti strategi sumber yang sama; permintaan tidak dapat berjaya mengambil data dari domän yang berbeza, sub-domän atau protokol.
Lebih banyak contoh
Contoh 1
Muat kandungan fail feeds.html
$("#feeds").load("feeds.html");
Contoh 2
Dengan contoh di atas, tetapi menghantar parameter tambahan dalam bentuk POST dan menampilkan maklumat berjaya apabila berjaya:
$("#feeds").load("feeds.php", {limit: 25}, function(){
alert("25 entri terakhir di feed telah dimuatkan");
});
Contoh 3
Muat bahagian pemanduan paksi kiri artikel ke dalam senarai tak beraturan:
Kod HTML:
<b>Pautan jQuery:</b> <ul id="links"></ul>
Kod jQuery:
$("#links").load("/Main_Page #p-Getting-Started li");
Lebih banyak contoh TIY
- Membuat permintaan AJAX dan menghantar data melalui permintaan ini
- Bagaimana hendak gunakan parameter data untuk menghantar data melalui permintaan AJAX. (Contoh ini dijelaskan dalam pengajaran AJAX.)
- Membuat permintaan AJAX dan menghantar data melalui permintaan ini
- Bagaimana hendak gunakan parameter function untuk memproses hasil data daripada permintaan AJAX.
- Membuat permintaan AJAX dengan kesalahan
- Bagaimana hendak gunakan parameter function untuk memproses kesalahan dalam permintaan AJAX (menggunakan parameter XMLHttpRequest).
