jQuery - Metode AJAX load()


beban jQuery () Metode

Metode jQuery load()adalah metode AJAX yang sederhana namun kuat.

Metode load()ini memuat data dari server dan menempatkan data yang dikembalikan ke elemen yang dipilih.

Sintaksis:

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

Parameter URL yang diperlukan menentukan URL yang ingin Anda muat.

Parameter data opsional menentukan satu set pasangan kunci/nilai string kueri untuk dikirim bersama dengan permintaan.

Parameter callback opsional adalah nama fungsi yang akan dieksekusi setelah load()metode selesai.

Berikut adalah isi dari file contoh kami: "demo_test.txt":

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

Contoh berikut memuat konten file "demo_test.txt" ke dalam <div>elemen tertentu:

Contoh

$("#div1").load("demo_test.txt");

Dimungkinkan juga untuk menambahkan pemilih jQuery ke parameter URL.

Contoh berikut memuat konten elemen dengan id="p1", di dalam file "demo_test.txt", ke dalam <div>elemen tertentu:

Contoh

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

Parameter callback opsional menentukan fungsi callback untuk dijalankan saat load()metode selesai. Fungsi panggilan balik dapat memiliki parameter yang berbeda:

  • responseTxt - berisi konten yang dihasilkan jika panggilan berhasil
  • statusTxt - berisi status panggilan
  • xhr - berisi objek XMLHttpRequest

Contoh berikut menampilkan kotak peringatan setelah metode load() selesai. Jika load()metode telah berhasil, ini akan menampilkan "Konten eksternal berhasil dimuat!", dan jika gagal akan menampilkan pesan kesalahan:

Contoh

$("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);
  });
});

Referensi jQuery AJAX

Untuk gambaran lengkap tentang semua metode jQuery AJAX, silakan kunjungi Referensi AJAX jQuery kami .