9.1 $ objek dan kaedah ajax dalam jQuery

jQuery juga mempunyai objek global khas untuk bekerja dengan rangkaian. Seperti yang anda boleh meneka, ia dipanggil $. Ya, itulah namanya. Tetapi ia mudah dan selesa.

Katakan anda ingin menghantar permintaan kepada API dalam JavaScript anda dan memproses respons yang diterima. Ini boleh dilakukan seperti ini:


$.ajax({
  type: "POST",
  url: "api.codegym.cc",
  data: {name: 'Bill', location: 'Radmond'},
  success: function(msg){
    alert( "Person found: " + msg );
  }
});

Itu sahaja, itu sahaja kodnya. $Kami memanggil kaedah pada objek ajax(), di mana kami lulus objek yang menerangkan semua yang kami perlukan: kedua-dua permintaan dan tindak balas.

  • Medan typemenentukan jenis permintaan HTTP: GETatauPOST
  • Medan urlmenentukan urlpermintaan yang akan dihantar.
  • Medan datamenentukan data permintaan dalam format JSON
  • Medan kejayaan menentukan fungsi yang akan dipanggil selepas respons yang berjaya daripada pelayan.

9.2 Pertanyaan berguna

Tetapi jika anda tidak perlu memindahkan sebarang data, maka permintaan itu boleh ditulis dengan lebih pendek. Sebagai contoh, anda boleh menulis permintaan POST mudah seperti ini :


$.post("ajax/test.html", function( data ) {
  $( ".result" ).html( data );
});

Adakah anda tahu apa yang dilakukan oleh kod tersebut $( ".result" ).html( data );? Cuba kita teka...

Ia menemui elemen dengan kelas hasil dalam dokumen dan menambah kod HTML di dalamnya - data data. Jadi dalam beberapa baris anda boleh memuat turun data dari pelayan dan menambahkannya ke halaman anda. Nah, bukankah itu kecantikan? :)

Permintaan GET juga boleh ditulis dalam beberapa baris:


$.get("ajax/test.html"., function( data ) {
  $( ".result" ).html( data );
});

Adakah anda ingin memuat turun dan melaksanakan skrip?


$.ajax({
  method: "GET",
  url: "test.js",
  dataType: "script"
});

Dapatkan halaman HTML terkini?


$.ajax({
  url: "test.html",
  cache: false
})
  .done(function( html ) {
    $( "#results" ).append( html );
  });

Terdapat beberapa dokumentasi jQuery yang sangat baik di internet:

API jQuery

jQuery.ajax()

Di samping itu, semua soalan biasa mudah digoogle dan berada di StackOverflow.