Pengantar Ajax Bagaimana saya bisa mendapatkan jQuery untuk membuat permintaan Ajax yang sinkron dan tidak asinkron? jquery sinkron ajax




Membuat permintaan ke server tanpa memuat ulang halaman. Ini adalah metode tingkat rendah dengan banyak penyesuaian. Itu mendasari semua metode ajax lainnya. Memiliki dua kasus penggunaan:

url- permintaan alamat.
pengaturan— dalam parameter ini, Anda dapat menyetel setelan untuk permintaan ini. Ditentukan menggunakan objek dalam format (name:value, name:value...) . Tidak ada pengaturan yang diperlukan. Anda dapat mengatur pengaturan default menggunakan metode $.ajaxSetup().

Daftar pengaturan

↓ nama :ketik (nilai bawaan)

Saat permintaan dibuat, header menunjukkan jenis konten yang diizinkan yang diharapkan dari server. Nilai tipe ini akan diambil dari parameter accepts.

Secara default, semua permintaan tanpa memuat ulang halaman terjadi secara asinkron (yaitu, setelah mengirim permintaan ke server, halaman tidak berhenti bekerja menunggu tanggapan). Jika Anda memerlukan eksekusi kueri sinkron, setel parameter ke false . Permintaan lintas domain dan permintaan jenis "jsonp" tidak dapat dijalankan dalam mode sinkron.

Ketahuilah bahwa mengeksekusi permintaan dalam mode sinkron dapat mengakibatkan penguncian halaman hingga permintaan selesai sepenuhnya.

Bidang ini berisi fungsi yang akan dipanggil sesaat sebelum permintaan ajax dikirim ke server. Fungsi seperti itu dapat berguna untuk memodifikasi objek jqXHR (di versi perpustakaan sebelumnya (sebelum 1.5), XMLHttpRequest digunakan sebagai pengganti jqXHR). Misalnya, Anda dapat mengubah / menentukan tajuk (header) yang diinginkan, dll. Objek jqXHR akan diteruskan ke fungsi sebagai argumen pertama. Argumen kedua adalah pengaturan permintaan.

Anda dapat menentukan header permintaan tambahan (header) di kolom ini. Perubahan ini akan diimplementasikan sebelum panggilan ke beforeSend, saat pengeditan akhir tajuk dapat dilakukan.

Saat pengaturan ini disetel ke true , permintaan akan dijalankan dengan status "berhasil" hanya jika respons dari server berbeda dengan respons sebelumnya. jQuery memeriksa fakta ini dengan melihat header Last-Modified. Sejak jQuery-1.4, selain Last-Modified, "etag" juga dicentang (keduanya disediakan oleh server dan diperlukan untuk memberi tahu browser bahwa data yang diminta dari server tidak berubah sejak permintaan sebelumnya).

Mengizinkan status sumber halaman disetel ke lokal (seolah-olah melalui protokol file), meskipun jQuery mengenalinya secara berbeda. Perpustakaan memutuskan bahwa halaman berjalan secara lokal jika ada protokol berikut: file, *-extension, dan widget.

Disarankan untuk mengatur nilai parameter isLocal global - menggunakan fungsi $.ajaxSetup() , dan bukan dalam pengaturan permintaan ajax individual.

Menentukan nama parameter yang ditambahkan ke url selama permintaan jsonp (secara default, "callback" digunakan - "http://siteName.ru?callback=...").

Dimulai dengan jQuery-1.5, menyetel parameter ini ke false akan mencegah parameter ekstra ditambahkan ke url. Dalam hal ini, Anda harus menetapkan nilai properti jsonpCallback secara eksplisit. Misalnya: (jsonp:false, jsonpCallback:"callbackName") .

Menentukan nama fungsi yang akan dipanggil saat server merespons permintaan jsonp. Secara default, jQuery menghasilkan nama arbitrer untuk fungsi ini, yang merupakan opsi pilihan untuk menyederhanakan pekerjaan perpustakaan. Salah satu alasan untuk menentukan fungsi penanganan permintaan jsonp Anda sendiri adalah untuk meningkatkan caching permintaan GET.

Dimulai dengan jQuery-1.5, Anda dapat menentukan fungsi dalam parameter ini untuk memproses sendiri respons server. Dalam hal ini, fungsi yang ditentukan harus mengembalikan data yang diterima dari server (dalam fungsi yang ditentukan, data tersebut akan tersedia di parameter pertama).

Secara default, semua data yang dikirimkan ke server pertama-tama diubah menjadi string (format url: fName1=nilai1&fName2=nilai2&...) yang sesuai dengan "application/x-www-form-urlencoded". Jika Anda perlu mengirim data yang tidak dapat diproses dengan cara ini (misalnya, dokumen DOM), Anda harus menonaktifkan opsi processData.

Parameter ini digunakan untuk permintaan ajax lintas-domain dari tipe GET, tipe data dapat berupa "jsonp" atau "skrip". Menentukan pengkodean di mana permintaan lintas domain akan dieksekusi. Ini diperlukan jika server di domain asing menggunakan pengkodean yang berbeda dari pengkodean di server domain asli.

(Pengaturan ini diperkenalkan di jQuery-1.5) satu set pasangan di mana kode eksekusi permintaan dipetakan ke fungsi yang akan dipanggil dalam kasus ini. Misalnya, untuk kode 404 (halaman tidak ada), Anda dapat menampilkan pesan di layar:

$.ajax (( statusCode: ( 404 : function() ( alert ( "Halaman tidak ditemukan") ; } } } ) ;

Fungsi yang merespons kode sukses akan menerima argumen yang sama dengan fungsi penangan sukses (ditentukan dalam parameter sukses), dan fungsi yang merespons kode kesalahan akan sama dengan fungsi error.

Fungsi yang akan dipanggil jika permintaan ke server berhasil diselesaikan. Tiga parameter akan diteruskan ke sana: data dikirim oleh server dan sudah diproses sebelumnya (yang berbeda untuk tipe data yang berbeda). Parameter kedua adalah string dengan status eksekusi. Parameter ketiga berisi objek jqXHR (di versi pustaka sebelumnya (sebelum 1.5), XMLHttpRequest digunakan sebagai pengganti jqXHR). Dimulai dengan jQuery-1.5, alih-alih satu fungsi, parameter ini dapat menerima berbagai fungsi.

Saatnya menunggu respons dari server. Ditentukan dalam milidetik. Jika waktu ini terlampaui, permintaan akan diakhiri dengan kesalahan dan kejadian kesalahan (lihat deskripsi di atas) akan dipicu, yang akan memiliki status "batas waktu".

Waktu dihitung sejak fungsi $.ajax dipanggil. Mungkin saja beberapa permintaan lain akan diaktifkan pada titik ini dan browser akan menunda eksekusi permintaan saat ini. Pada kasus ini waktu habis dapat selesai meskipun permintaan sebenarnya belum dimulai.

Di jQuery-1.4 dan sebelumnya, ketika batas waktu habis, objek XMLHttpRequest akan masuk ke status kesalahan dan mengakses bidangnya mungkin mengeluarkan pengecualian. DI DALAM Firefox 3.0+ skrip dan permintaan jenis JSONP tidak akan dibatalkan saat waktu habis. Mereka akan selesai bahkan setelah waktu ini berakhir.

Fungsi yang akan menyediakan objek XMLHttpRequest. Secara default, untuk browser IE objek ini adalah ActiveXObject, jika tidak, ini adalah XMLHttpRequest. Dengan opsi ini, Anda dapat menyuntikkan versi Anda sendiri dari objek ini.

(Pengaturan ini diperkenalkan di jQuery-1.5.1) Satu set pasangan (nama:nilai) untuk mengubah/menambahkan nilai bidang yang sesuai dari objek XMLHttpRequest. Misalnya, Anda dapat menyetel properti withCredentials ke true saat membuat permintaan lintas domain:

$.ajax (( url: a_cross_domain_url, xhrFields: ( withCredentials: true ) ) );

DI DALAM jQuery-1.5 properti withCredentials tidak didukung oleh XMLHttpRequest asli dan akan diabaikan dalam permintaan lintas domain. Di semua versi perpustakaan berikutnya, ini telah diperbaiki.

Penangan acara

Pengaturan beforeSend, error, dataFilter, success, dan complete (dijelaskan di bagian sebelumnya) memungkinkan Anda untuk mengatur event handler yang terjadi pada saat-saat tertentu dalam pelaksanaan setiap permintaan ajax.

sebelumKirim terjadi tepat sebelum permintaan dikirim ke server. kesalahan terjadi ketika permintaan gagal. filter data terjadi ketika data tiba dari server. Memungkinkan Anda memproses data "mentah" yang dikirim oleh server. kesuksesan terjadi ketika permintaan selesai dengan sukses. menyelesaikan terjadi dalam hal penyelesaian permintaan.

Contoh penggunaan sederhana. Kami akan menampilkan pesan saat permintaan berhasil diselesaikan:

$.ajax (( url: "ajax/test.html", sukses: function () ( alert ("Pemuatan telah dilakukan." ); ) ) );

Dimulai dengan jQuery-1.5, metode $.ajax() mengembalikan objek jqXHR yang, antara lain, mengimplementasikan antarmuka yang ditangguhkan, memungkinkan Anda menentukan penangan eksekusi tambahan. Selain metode .done(), .fail(), dan .then() standar untuk objek yang ditangguhkan, yang dapat digunakan untuk menyetel penangan, jqXHR mengimplementasikan .success(), .error(), dan .complete( ) . Ini dilakukan untuk mencocokkan nama biasa dari metode yang digunakan untuk mengatur penangan untuk mengeksekusi permintaan ajax. Namun, dimulai dengan jQuery-1.8, ketiga metode ini akan menjadi tidak diinginkan untuk digunakan.

Beberapa jenis permintaan, seperti jsonp atau permintaan GET lintas domain, tidak dimaksudkan untuk menggunakan objek XMLHttpRequest. Dalam hal ini, XMLHttpRequest dan textStatus yang diteruskan ke handler akan berisi nilai undefined .

Di dalam handler, variabel this akan berisi nilai dari parameter konteks. Jika tidak disetel, ini akan berisi objek pengaturan.

parameter tipedata

Fungsi $.ajax() mempelajari tentang jenis data yang dikirim oleh server dari server itu sendiri (menggunakan MIME). Selain itu, dimungkinkan untuk menunjukkan (klarifikasi) secara pribadi bagaimana menafsirkan data ini. Hal ini dilakukan dengan menggunakan parameter dataType. Nilai yang mungkin untuk parameter ini:

"xml" — dokumen xml yang diterima akan tersedia dalam bentuk teks. Anda dapat mengerjakannya dengan alat jQuery standar (serta dengan dokumen html). "html" - html yang dihasilkan akan tersedia dalam bentuk teks. Jika itu berisi skrip dalam tag
Namamu:
Nomor gulungan:

Langkah 2: Buat details.php dan tempatkan kode berikut di dalamnya:

Pada kode di atas, kita mendapatkan alamat siswa menggunakan nomor urut dan namanya.

Untuk contoh ini, Anda perlu membuat database sekolah dan tabel siswa. Tabel siswa berisi bidang dengan nama, nomor urut, dan alamat.

Semoga artikel ini bermanfaat bagi Anda.

Keterangan: Melakukan permintaan HTTP (Ajax) asinkron.

  • Ditambahkan dalam versi: 1.5

      pengaturan

      $.ajaxSetup() . Di bawah ini adalah daftar lengkap semua pengaturan.

  • Ditambahkan dalam versi: 1.0

      pengaturan

      Array asosiatif untuk konfigurasi permintaan Ajax. Semua pengaturan bersifat opsional (opsional). Nilai default dapat diatur menggunakan metode $.ajaxSetup().

      • menerima(nilai default: tergantung pada tipe data)

        Larik asosiatif yang mewakili tipe data yang diberikan ke tipe MIME-nya, yang dikirim oleh bidang Terima di header HTTP permintaan. Header ini memberi tahu server format respons mana yang akan diterima. Misalnya, tipe data kustom berikut mycustomtype akan dikirim dalam permintaan: Penting: Anda juga harus menentukan konverter yang sesuai untuk penanganan respons Ajax yang benar.

        asinkron

        Secara default, semua permintaan dikirim secara asinkron (yakni ini diatur ke true secara default). Jika Anda memerlukan permintaan sinkron, setel nilai parameter ke false . Cross-domain dan dataType: permintaan "jsonp" tidak mendukung operasi sinkron. Perhatikan bahwa permintaan sinkron dapat memblokir browser untuk sementara atau menangguhkan beberapa operasi aktif saat permintaan sedang dijalankan. Sejak jQuery 1.8, menggunakan async: false dengan jqXHR($.Deferred) Tidak direkomendasikan; Anda harus menggunakan penangan success / error / complete alih-alih metode objek jqXHR yang sesuai seperti jqXHR.done() .

        sebelumKirim

        Penangan pra-permintaan tempat Anda dapat memodifikasi objek jqXHR (Di jQuery 1.4.x dan yang lebih lama, XMLHTTPRequest) sebelum permintaan Ajax dikirim. Gunakan judul khusus, dll. Objek jqXHR dan pengaturan diteruskan sebagai argumen. Ini adalah Acara Ajax. Mengembalikan salah dalam fungsi beforeSend akan membatalkan permintaan. Pada jQuery 1.5, opsi beforeSend akan dipanggil terlepas dari jenis permintaannya.

        cache(nilai default: true, false untuk dataType "script" dan "jsonp")

        Jika disetel ke false , halaman yang diminta secara paksa tidak akan di-cache oleh browser. Penting: Menyetel cache ke false hanya akan bekerja dengan benar dengan permintaan HEAD dan GET. Ini berfungsi dengan menambahkan "_=(timestamp)" ke alamat GET permintaan. Parameter ini tidak diperlukan untuk jenis permintaan lain, kecuali dalam kasus IE8 ketika permintaan POST dibuat ke URL yang sama dengan permintaan GET yang telah dibuat.

        menyelesaikan

        Fungsi yang dipanggil saat permintaan selesai (setelah penangan sukses atau kesalahan dipanggil). Fungsi mengambil dua argumen: objek jqXHR (di jQuery 1.4.x dan di bawahnya, XMLHTTPRequest) dan string status permintaan ("success" , "notmodified" , "nocontent" , "error" , "timeout" , "abort" atau "kesalahan parser" "). Sejak jQuery 1.5, parameter lengkap dapat mengambil berbagai fungsi. Setiap fungsi akan dipanggil secara bergantian. Adalah acara Ajax.

        isi

        Array asosiatif dengan pasangan string/regex yang menentukan bagaimana jQuery akan mengurai respons, bergantung pada jenis konten. (Ditambahkan dalam versi: 1.5)

        Jenis konten(default: "application/x-www-form-urlencoded; charset=UTF-8")

        Saat data dikirim ke server, Content-Type ini digunakan. Nilai defaultnya adalah "application/x-www-form-urlencoded; charset=UTF-8" yang bagus untuk sebagian besar kasus. Jika Anda secara eksplisit meneruskan tipe konten ke metode $.ajax() , maka itu akan selalu dikirim ke server (bahkan jika tidak ada data yang dikirim ke server). Pada jQuery 1.6, Anda dapat menentukan false agar jQuery tidak melewatkan bidang Content-Type sama sekali di header. Penting: Spesifikasi W3C XMLHttpRequest menyatakan bahwa Anda selalu menggunakan pengkodean UTF-8; menentukan penyandian yang berbeda tidak akan memaksa browser untuk mengubah penyandian. Penting: Untuk permintaan lintas-domain, menyetel jenis konten ke selain application/x-www-form-urlencoded , multipart/form-data , atau text/plain akan memaksa browser untuk mengirimkan permintaan OPTIONS persiapan ke server.

        Objek ini akan menjadi konteks untuk semua penangan permintaan Ajax ini. Secara default, konteksnya adalah objek yang mewakili pengaturan Ajax yang digunakan saat dipanggil ($.ajaxSettings digabungkan dengan pengaturan yang diteruskan ke $.ajax). Misalnya, menentukan elemen DOM sebagai konteks akan menjadikannya konteks dalam penangan permintaan lengkap:

        url: "test.html",

        konteks: dokumen.tubuh

        ))selesai(fungsi () (

        $(ini ).addClass("selesai");

      • konverter(nilai default: ("* text": window.String, "text html": true, "text json": jQuery.parseJSON, "text xml": jQuery.parseXML))

        lintas domain(nilai default: salah untuk permintaan domain yang sama, benar untuk permintaan lintas domain)

        Jika Anda ingin memaksa permintaan ke domain yang sama dengan permintaan lintas domain (seperti JSONP), setel nilainya ke true . Ini memungkinkan, misalnya, mengembalikan pengalihan dari server ke domain lain. (Ditambahkan dalam versi: 1.5)

        Data dikirim ke server. Mereka akan dikonversi menjadi string jika belum menjadi string. Untuk permintaan GET, string ini akan ditambahkan ke URL. Lihat parameter processData untuk mencegah pemrosesan otomatis ini. Objek harus berupa array asosiatif (pasangan kunci/nilai). Jika nilainya adalah array, maka jQuery membuat serialisasi nilai array dengan kunci yang sama berdasarkan nilai parameter tradisional (dijelaskan di bawah).

        filter data

        Fungsi yang digunakan untuk memproses data mentah dari XMLHttpRequest. Ini adalah fungsi awal untuk memvalidasi dan membersihkan data respons. Anda harus mengembalikan data yang dibersihkan. Fungsi mengambil dua argumen: data awal yang diberikan oleh server dan nilai parameter dataType.

        tipe data(default: Jenis umum (xml, json, skrip, atau html))

        Jenis data yang Anda harapkan dari server. Jika tidak ditentukan, jQuery akan mencoba menentukannya berdasarkan tipe MIME dari respons (tipe xml MIME akan memberikan XML, di 1.4 json akan memberikan objek JavaScript, di skrip 1.4 akan dieksekusi sebagai skrip, dan yang lainnya akan menjadi dikembalikan sebagai string). Jenis yang mungkin (dan hasilnya diteruskan sebagai argumen pertama ke penangan permintaan sukses):

        • "xml" : Mengembalikan dokumen XML yang dapat diproses dengan jQuery.
        • "html" : Mengembalikan HTML sebagai teks biasa; tag skrip yang disertakan akan dijalankan saat HTML ini dimasukkan ke dalam DOM.
        • "script" : Mengevaluasi respons sebagai JavaScript dan mengembalikannya sebagai teks biasa. Menonaktifkan caching permintaan (dengan menambahkan parameter _= ke URL) meskipun nilai parameter cache adalah true . Penting: Ini akan mengubah POST menjadi GET untuk permintaan ke domain jarak jauh.
        • "json" : Mengevaluasi respons sebagai JSON dan mengembalikan objek JavaScript. Permintaan lintas-domain "json" dikonversi menjadi "jsonp" kecuali jika jsonp: false ditentukan dalam parameter permintaan. Data JSON diproses dalam urutan yang ketat; pelanggaran format apa pun akan ditolak dan kesalahan penguraian akan terjadi. Pada jQuery 1.9, permintaan kosong juga akan ditolak; server harus mengembalikan respons nol atau ().
        • "jsonp" : Memuat data di JSON menggunakan format pemuatan JSONP. Menambahkan parameter tambahan "?callback=?" ke akhir URL untuk menentukan fungsi penangan. Matikan caching dengan menambahkan parameter "_=" ke URL, meskipun nilai parameter cache adalah true .
        • "teks" : String dengan teks.
        • beberapa nilai yang dipisahkan ruang: sejak jQuery 1.5, jQuery dapat mengonversi dataType dari apa yang diterima di kolom header Content-Type menjadi yang Anda butuhkan. Misalnya, jika Anda ingin menggunakan teks respons sebagai XML, gunakan nilai "text xml" untuk parameter tipe data. Anda juga dapat membuat permintaan JSONP jika diterima sebagai teks dan ditafsirkan oleh jQuery sebagai XML: "jsonp text xml" . Demikian pula, string steno seperti "jsonp xml" pertama-tama akan mencoba mengonversi dari JSONP ke XML, dan jika itu tidak memungkinkan, konversikan dari JSONP ke teks lalu dari teks ke xml.
      • Fungsi dipanggil jika permintaan berakhir dengan kesalahan. Fungsi mengambil tiga argumen: objek jqXHR (di jQuery 1.4.x, XMLHttpRequest), string yang menjelaskan jenis kesalahan yang terjadi, dan objek pengecualian opsional jika ada yang dilemparkan. Nilai yang mungkin untuk argumen kedua (selain null) adalah "timeout" , "error" , "abort" dan "parsererror" . Saat kesalahan HTTP terjadi, argumen errorThrown akan mengambil bagian teks dari status HTTP, seperti "Tidak Ditemukan" atau "Kesalahan Server Internal". Sejak jQuery 1.5, parameter kesalahan dapat menerima berbagai fungsi. Setiap fungsi akan dipanggil dalam urutannya sendiri. Penting: Penangan ini tidak dipanggil untuk skrip lintas-domain dan permintaan JSONP lintas-domain. Apakah acara Ajax.

        global(nilai default: benar)

        Parameter mengontrol apakah akan memicu peristiwa Ajax global untuk permintaan ini. Nilai default adalah benar. Menyetel nilai ke false akan mencegah penangan global seperti ajaxStart atau ajaxStop dipanggil. Ini dapat digunakan untuk menangani berbagai acara Ajax.

        header(nilai default: ())

        Objek dengan kolom header permintaan HTTP tambahan untuk dikirim melalui XMLHttpRequest. Header X-Requested-With: XMLHttpRequest selalu ditambahkan, tetapi nilai XMLHttpRequest defaultnya dapat diubah melalui parameter ini. Nilai di header juga bisa diganti di fungsi beforeSend. (ditambahkan dalam versi: 1.5)

        ifModified(nilai default: salah)

        Mengizinkan permintaan berhasil hanya jika respons telah berubah sejak permintaan terakhir. Ini dilakukan dengan mencentang bidang tajuk Terakhir-Dimodifikasi. Nilai defaultnya adalah false , mengabaikan kolom header permintaan HTTP. Di jQuery 1.4 dan di bawahnya, algoritme ini juga memeriksa kolom header respons "etag" yang ditentukan oleh server untuk menemukan data yang tidak berubah.

        isLocal(nilai default: tergantung pada protokol lokal saat ini)

        Mengizinkan lingkungan saat ini menjadi "lokal" (misalnya sistem file), bahkan jika jQuery tidak mengenalinya secara default. Protokol berikut saat ini dikenali sebagai lokal: file , *-extension dan widget . Jika opsi isLocal perlu diubah, disarankan untuk melakukannya sekali menggunakan metode $.ajaxSetup() . (ditambahkan dalam versi: 1.5.1)

        Mengganti nama fungsi panggilan balik dalam permintaan JSONP. Nilai ini digunakan sebagai pengganti nama fungsi "panggilan balik" dalam parameter URL "panggilan balik=?". Jadi (jsonp:"onJSONPLoad") akan diteruskan ke server sebagai "onJSONPLoad=?" . Sejak jQuery 1.5, menyetel parameter jsonp ke false mencegah jQuery menambahkan string "?callback" ke URL atau mencoba menggunakan "=?" untuk mengubah respon. Dalam hal ini, Anda harus secara eksplisit menentukan nilai parameter jsonpCallback. Misalnya, ( jsonp: false, jsonpCallback: "callbackName" ) . Jika Anda tidak mempercayai tujuan permintaan Ajax Anda, disarankan untuk alasan keamanan untuk menyetel nilai parameter jsonp ke false .

        jsonpCallback

        Menentukan nama fungsi callback untuk permintaan JSONP. Nilai ini akan digunakan sebagai pengganti nama acak yang dibuat secara otomatis oleh jQuery. Lebih disukai jQuery menghasilkan nama unik itu sendiri, ini membuatnya lebih mudah untuk mengelola kueri dan menangani kesalahan. Anda dapat menentukan fungsi callback jika Anda ingin memberikan caching yang lebih baik daripada caching browser untuk permintaan GET. Sejak jQuery 1.5, Anda juga dapat menggunakan fungsi untuk parameter ini, dalam hal ini, nilai jsonpCallback diatur sebagai nilai kembalian dari fungsi ini.

        metode

        mimeType

        kata sandi

        Kata sandi untuk digunakan dengan XMLHttpRequest sebagai tanggapan atas permintaan otorisasi http dasar.

        data proses(nilai default: benar)

        Secara default, data yang diteruskan ke parameter data sebagai objek (secara teknis, apa pun kecuali string) akan diuraikan dan diubah menjadi string kueri yang cocok untuk tipe data default "application/x-www-form-urlencoded" . Jika Anda ingin mengirimkan dokumen DOM, atau data mentah lainnya, setel parameter ini ke false .

        scriptCharset

        Hanya berlaku saat menggunakan "skrip" sebagai transportasi (mis. permintaan lintas domain dengan tipe data "jsonp" atau "skrip" dan metode "GET"). Menyetel atribut charset dari tag skrip untuk digunakan dalam permintaan. Digunakan saat pengkodean karakter pada halaman saat ini berbeda dari pengkodean karakter skrip jarak jauh.

        Kode status(nilai default: ())

        Objek dengan kode status HTTP numerik dan fungsi yang akan dipanggil ketika status respons memiliki nilai yang sesuai. Misalnya, peringatan berikut akan dipanggil saat status respons adalah 404:

        404 : fungsi () (

        peringatan( "halaman tidak ditemukan");

        Jika permintaan berhasil, maka fungsi yang sesuai akan mengambil parameter yang sama dengan penangan sukses; jika hasilnya error (termasuk pengalihan 3xx), fungsi ini akan menerima parameter yang sama dengan penangan error.

        (ditambahkan dalam versi: 1.5)
      • Fungsi untuk memanggil jika permintaan berhasil. Fungsi mengambil tiga argumen: data - data yang dikembalikan dari server, diformat menurut parameter dataType atau dataFilter jika ditentukan; string yang menjelaskan status; dan objek jqXHR (di jQuery 1.4.x dan di bawah XMLHttpRequest). Sejak jQuery 1.5, Parameter ini dapat menerima berbagai fungsi. Setiap fungsi akan dipanggil dalam antriannya sendiri. Adalah acara Ajax.

        Menentukan batas waktu permintaan (dalam milidetik). Pengaturan ini mengesampingkan set timeout global dengan metode $.ajaxSetup(). Batas waktu ini dipicu saat metode $.ajax dijalankan; jika ada beberapa permintaan lain yang sedang berlangsung dan browser tidak memiliki koneksi jaringan, maka dimungkinkan untuk meminta batas waktu sebelum dikirim. Di jQuery versi 1.4.x dan di bawahnya, objek XMLHttpRequest akan berada dalam status tidak valid jika batas waktu terlampaui; memanggil metode apa pun pada objek akan memunculkan pengecualian. Di Firefox 3.0+, skrip dan permintaan JSONP tidak dapat dibatalkan oleh batas waktu; skrip akan berfungsi meskipun setelah batas waktu habis.

        tradisional

        jenis(nilai default: "DAPATKAN")

        Sinonim untuk parameter metode. Anda harus menggunakan type jika Anda menggunakan versi jQuery sebelum 1.9.0.

        url(nilai default: URL Saat Ini)

        nama belakang

        Nama pengguna yang digunakan dengan XMLHttpRequest sebagai tanggapan atas permintaan otorisasi http dasar.

        xhr(default: ActiveXObject bila tersedia (IE), jika tidak XMLHttpRequest)

        Fungsi panggilan balik untuk membuat objek XMLHttpRequest. Standarnya adalah menggunakan ActiveXObject saat tersedia (untuk IE), jika tidak, gunakan XMLHttpRequest. Anda memiliki opsi untuk mengesampingkan pembuatan objek ini dan mengembalikan implementasi XMLHttpRequest Anda sendiri, atau menyempurnakan pembuatan objek ini.

        xhrFields

        Objek dengan pasangan fieldName-fieldValue untuk disetel ke objek XHR asli. Misalnya, Anda dapat menggunakan withCredentials yang disetel ke true untuk permintaan lintas domain jika perlu.

        url: a_cross_domain_url,

        dengan Kredensial: benar

        Di jQuery 1.5, properti withCredentials tidak akan disebarkan ke objek XHR asli sehingga permintaan CORS yang memerlukannya akan mengabaikan tanda ini. Untuk alasan ini, kami merekomendasikan penggunaan jQuery 1.5.1+.

        (ditambahkan dalam versi: 1.5.1)

Fungsi $.ajax() mendasari semua permintaan Ajax yang dikirim dengan jQuery. Seringkali tidak perlu memanggil fungsi ini karena ada beberapa alternatif level yang lebih tinggi seperti $.get() dan .load() yang lebih mudah digunakan. Jika diperlukan opsi yang kurang umum, melalui $.ajax() Anda dapat mengonfigurasi permintaan dengan lebih fleksibel.

Dalam bentuknya yang paling sederhana, fungsi $.ajax() dapat dipanggil tanpa argumen:

Penting: pengaturan default dapat diatur menggunakan fungsi $.ajaxSetup().

Contoh ini, tanpa menggunakan parameter, memuat konten halaman saat ini tetapi tidak melakukan apa pun dengan hasilnya. Untuk menggunakan hasilnya, Anda dapat mengimplementasikan salah satu fungsi callback.

objek jqXHR

objek jQuery XMLHttpRequest (jqXHR) yang dikembalikan oleh fungsi $.ajax() sejak jQuery 1.5 adalah add-on untuk objek XMLHttpRequest asli. Misalnya, berisi properti responseText dan responseXML, serta metode getResponseHeader() . Ketika transportasi yang digunakan untuk permintaan adalah sesuatu selain XMLHttpRequest (misalnya, tag skrip untuk permintaan JSONP), objek jqXHR akan mengemulasi fungsionalitas XHR asli jika memungkinkan.

Sejak jQuery 1.5.1, objek jqXHR juga berisi metode overrideMimeType() (tersedia di jQuery 1.4.x tetapi untuk sementara dihapus di jQuery 1.5). Metode .overrideMimeType() dapat digunakan dalam handler beforeSend() , misalnya, untuk mengubah bidang header tipe konten:

url: "http://fiddle.jshell.net/favicon.png",

sebelumKirim: fungsi(xhr)(

xhr.overrideMimeType( "teks/polos; charset=x-ditentukan pengguna");

Selesai(fungsi (data) (

jika (konsol && konsol.log) (

console.log("Contoh data:" , data.slice(0 , 100 ));

Objek jqXHR yang dikembalikan oleh metode $.ajax() di jQuery 1.5 mengimplementasikan antarmuka Promise, memberikannya semua properti, metode, dan perilaku Promise . Metode ini mengambil satu atau lebih argumen, yang dipanggil saat permintaan dimulai dengan $.ajax() selesai. Ini memungkinkan Anda untuk menetapkan beberapa penangan ke satu permintaan, dan bahkan menetapkan penangan setelah permintaan dapat diselesaikan. (Jika permintaan sudah dijalankan, maka penangan akan segera dipanggil). Metode Janji yang tersedia pada objek jqXHR adalah:

  • jqXHR.done(fungsi(data, status teks, jqXHR) ());
  • jqXHR.fail(fungsi(jqXHR, status teks, errorThrown) ());
  • jqXHR.always(function(data|jqXHR, status teks, jqXHR|errorThrown) ( ));(ditambahkan dalam jQuery 1.6)

    Alternatif untuk membuat handler lengkap, metode .always() menggantikan metode .complete() yang sudah tidak digunakan lagi.

  • jqXHR.then(fungsi(data, statusteks, jqXHR) (), fungsi(jqXHR, statusteks, errorThrown) ());

Perhatian: penangan jqXHR.success() , jqXHR.error() , dan jqXHR.complete() akan dihapus di jQuery 3.0. Anda dapat menggunakan masing-masing jqXHR.done() , jqXHR.fail() dan jqXHR.always() .

Untuk kompatibilitas mundur dengan kode XMLHttpRequest, objek jqXHR menyediakan properti dan metode berikut:

  • readyState
  • status
  • teksstatus
  • responseXML dan/atau responseText ketika permintaan masing-masing mengembalikan xml dan/atau teks
  • setRequestHeader(name, value) header yang menyimpang dari standar akan mengganti nilai lama dengan yang baru, daripada menggabungkan nilai lama dan baru
  • getAllResponseHeaders()
  • getResponseHeader()
  • Kode status()
  • abortus()

Tidak ada mekanisme onreadystatechange , karena done , fail , always , dan statusCode mencakup semua kemungkinan persyaratan.

Pemesanan panggilan balik

Parameter beforeSend , error , dataFilter , success , dan complete semuanya mengambil fungsi callback sebagai nilai yang dipanggil pada waktu yang tepat.

Sejak jQuery 1.5 fungsi gagal dan selesai, dan, pada jQuery 1.6, akan selalu dipanggil pertama, yang pertama dalam antrean terkelola, memungkinkan lebih dari satu penangan untuk setiap elemen antrean. Lihat metode yang ditangguhkan, yang mengimplementasikan penangan metode $.ajax() internal.

Fungsi panggilan balik yang disediakan oleh metode $.ajax() adalah sebagai berikut:

  1. beforeSend selalu dipanggil; mengambil objek jqXHR dan objek pengaturan sebagai parameter.
  2. kesalahan dipanggil jika permintaan gagal. Menerima objek jqXHR, string status kesalahan, dan objek pengecualian, jika ada. Beberapa kesalahan bawaan menyediakan string sebagai objek pengecualian: "batalkan", "batas waktu", "Tanpa Transportasi".
  3. dataFilter dipanggil segera setelah berhasil menerima data respons. Dibutuhkan sebagai parameter data yang dikembalikan dan nilai parameter dataType dan harus dikembalikan (kemungkinan data yang dimodifikasi) untuk diteruskan lebih lanjut ke penangan sukses.
  4. success disebut jika permintaan berhasil. Itu menerima data respons, string yang berisi kode sukses, dan objek jqXHR.
  5. Penanggung janji- .done() , .fail() , .always() dan .then() dijalankan sesuai urutan pendaftarannya.
  6. complete dipanggil saat permintaan selesai, terlepas dari keberhasilan atau kegagalan permintaan. Menerima objek jqXHR, string berformat dengan status sukses atau error.

Tipe data

Berbagai jenis respons terhadap panggilan $.ajax() mengalami berbagai jenis preprocessing sebelum melewati penangan keberhasilan. Tipe preconditioning bergantung pada bidang header Content-Type yang ditentukan dalam respons, tetapi dapat ditentukan secara eksplisit menggunakan opsi dataType. Jika parameter dataType diberikan, maka field header Content-Type akan diabaikan.

Tipe data yang mungkin adalah text , html , xml , json , jsonp , dan script .

Jika teks atau html ditentukan, tidak ada pemrosesan awal yang dilakukan. Data hanya diteruskan ke penangan keberhasilan dan tersedia melalui properti responseText objek jqXHR.

Jika xml ditentukan, maka respons diuraikan menggunakan jQuery.parseXML sebelum diteruskan ke XMLDocument di penangan sukses. Dokumen XML dapat diakses melalui properti responseXML dari objek jqXHR.

Jika json ditentukan, maka respons diurai menggunakan jQuery.parseJSON sebelum diteruskan ke objek untuk penangan sukses. Objek JSON yang dihasilkan tersedia melalui properti responseJSON objek jqXHR.

Jika skrip ditentukan, maka $.ajax() akan mengeksekusi kode JavaScript yang diterima dari server sebelum meneruskan kode tersebut sebagai string ke penangan sukses.

Jika jsonp ditentukan, $.ajax() akan secara otomatis menambahkan parameter (default) callback=? ke string URL permintaan. . Parameter jsonp dan jsonpCallback dari objek pengaturan diteruskan ke metode $.ajax() dapat digunakan untuk menentukan nama parameter URL dan nama fungsi panggilan balik JSONP. Server harus mengembalikan Javascript yang valid yang akan diteruskan ke penangan JSONP. $.ajax() akan mengeksekusi kode JavaScript yang dikembalikan, memanggil fungsi JSONP dengan namanya, sebelum meneruskan objek JSON ke success handler.

Mengirim data ke server

Secara default, permintaan Ajax dikirim menggunakan metode GET HTTP. Jika metode POST diperlukan, maka metode tersebut harus ditentukan dalam pengaturan menggunakan parameter tipe. Parameter ini mempengaruhi bagaimana data dari parameter data akan dikirim ke server. Data permintaan POST akan selalu dikirim ke server dalam pengkodean UTF-8 sesuai dengan standar W3C XMLHTTPRequest.

Parameter data dapat berisi string bentuk bebas, seperti bentuk berseri key1=value1&key2=value2 atau objek Javascript (key1: "value1", key2: "value2") . Jika opsi terakhir digunakan, data akan diubah menjadi string menggunakan metode jQuery.param() sebelum dikirim. Pemrosesan ini dapat dinonaktifkan dengan menentukan nilai false di parameter processData. Pemrosesan mungkin tidak diinginkan jika Anda ingin mengirim dokumen XML ke server, dalam hal ini ubah parameter contentType dari application/x-www-form-urlencoded ke tipe MIME yang lebih sesuai.

Pengaturan lanjutan

Parameter global mencegah eksekusi penangan yang terdaftar dengan .ajaxSend() , .ajaxError() , dan metode serupa. Ini bisa berguna, misalnya, untuk menyembunyikan indikator pemuatan yang diimplementasikan dengan .ajaxSend() jika permintaan dibuat sering dan cepat. Dengan permintaan lintas-domain dan JSONP, parameter global secara otomatis disetel ke false .

Jika server melakukan autentikasi HTTP sebelum memberikan respons, maka nama pengguna dan kata sandi harus dikirim menggunakan opsi nama pengguna dan kata sandi.

Permintaan Ajax diatur waktunya sehingga kesalahan dapat ditangkap dan ditangani untuk memberikan pengalaman pengguna yang terbaik. Batas waktu permintaan biasanya disetel secara default atau disetel secara global menggunakan $.ajaxSetup() alih-alih menentukan parameter batas waktu berdasarkan per permintaan.

Secara default, permintaan selalu dibuat, tetapi browser dapat memberikan respons dari cache-nya. Untuk menonaktifkan penggunaan hasil cache, setel nilai parameter cache ke false . Untuk memanggil kueri yang melaporkan bagaimana sumber daya telah berubah sejak kueri terakhir, setel nilai parameter ifModified ke true .

Parameter scriptCharset memungkinkan pengodean digunakan secara eksplisit dalam permintaan menggunakan tag