Rumah  >  Artikel  >  hujung hadapan web  >  tetapan global jquery

tetapan global jquery

王林
王林asal
2023-05-23 15:09:08720semak imbas

jQuery ialah salah satu perpustakaan JavaScript yang paling popular dalam pembangunan web moden Ia menyediakan pembangun cara yang boleh dipercayai dan mudah digunakan untuk memanipulasi dokumen HTML, mengendalikan acara, mencipta animasi, melakukan interaksi Ajax dan banyak lagi tugas biasa. . Walau bagaimanapun, apabila membangunkan tapak web atau aplikasi yang besar, anda mungkin perlu menggunakan jQuery dalam berbilang halaman, dan anda mungkin perlu menjalankannya dalam konfigurasi yang berbeza. Untuk tujuan ini, jQuery menyediakan beberapa pilihan tetapan global supaya pembangun boleh berkongsi konfigurasi mereka merentas berbilang halaman. Berikut ialah beberapa pilihan tetapan global jQuery biasa.

  1. $.ajaxSetup()

Kaedah $.ajaxSetup() membolehkan anda menetapkan pilihan AJAX global untuk jQuery. Pilihan ini akan digunakan untuk semua $.ajax(), $.get(), $.post(), dsb. permintaan AJAX yang anda tulis dalam halaman yang berbeza atau bahagian yang berbeza. Ini ialah pilihan tetapan global yang akan menjejaskan semua permintaan anda.

Anda boleh menggunakan kaedah $.ajaxSetup() dengan cara berikut:

$.ajaxSetup({
  url: "/api/user",
  type: "POST",
  dataType: "json"
});

Dalam contoh di atas, kami menetapkan URL lalai, kaedah HTTP dan jenis data tindak balas untuk permintaan AJAX. Tetapan ini akan digunakan pada semua permintaan AJAX yang dipanggil di seluruh tapak.

  1. $.ajaxPrefilter()

Kaedah $.ajaxPrefilter() membolehkan anda mempraproses data permintaan sebelum permintaan AJAX dihantar. Ia serupa dengan $.ajaxSetup(), tetapi ia hanya mempengaruhi permintaan AJAX apabila ia dipanggil. Dengan menggunakan $.ajaxPrefilter(), anda boleh mengubah suai parameter permintaan dan data tindak balas, atau menjalankan logik pengesahan sebelum permintaan dihantar.

Berikut ialah contoh penggunaan $.ajaxPrefilter():

$.ajaxPrefilter(function(options, originalOptions, jqXHR) {
  options.url = "/api" + options.url;
});

Dalam contoh di atas, kami telah menambah awalan "/api" di hadapan URL untuk semua permintaan AJAX. Melakukan ini mengelakkan memasukkan awalan ini berulang kali dalam permintaan AJAX.

  1. $.ajaxTransport()

Kaedah $.ajaxTransport() membolehkan anda mendaftar pengangkutan AJAX baharu. Secara lalai, jQuery menyokong XMLHttpRequest dan pengangkutan tag skrip, tetapi anda boleh mendaftarkan pengangkutan tersuai melalui $.ajaxTransport().

Berikut ialah contoh penggunaan $.ajaxTransport():

$.ajaxTransport("+image", function(options, originalOptions, jqXHR) {
  var img,
      deferred = $.Deferred(),
      dataType = options.dataType || "";

  if (dataType.toLowerCase() === "image") {
    img = new Image();

    img.onload = function() {
      deferred.resolve(this);
    };

    img.onerror = function() {
      deferred.reject();
    };

    img.src = options.url;

    return deferred.promise();
  }
});

Dalam contoh di atas, kami telah mendaftarkan jenis data baharu "+imej" dan menentukan cara menghantar objek Imej dipindahkan . Ini menjimatkan masa dan lebar jalur dalam memuatkan dan memaparkan imej dalam permintaan AJAX. Kaedah $.holdReady() membolehkan anda menjeda atau menyambung semula acara sedia jQuery. Acara sedia ialah acara $(document).ready(), yang akan dicetuskan apabila DOM dimuatkan dan dihuraikan sepenuhnya. Dengan menggunakan $.holdReady() anda boleh menangguhkan atau menghalang penembakan acara sedia untuk menunggu syarat tertentu sebelum kod lain dijalankan.

    Berikut ialah contoh penggunaan $.holdReady():
  1. $.holdReady(true);
    
    $.get("/settings", function(data) {
      // Some data processing here
      $.holdReady(false);
    });
  2. Dalam contoh di atas, kami menjeda acara sedia jQuery sebelum mendapatkan maklumat tetapan. Selepas $.get() selesai dan data diproses, kami mengeluarkan $.holdReady(), membenarkan acara sedia menyala semula.

Ringkasan

jQuery menyediakan beberapa pilihan tetapan global yang berguna yang boleh membantu pembangun web mengendalikan banyak tugas web biasa dengan cara yang boleh dipercayai dan konsisten. Melalui kaedah seperti $.ajaxSetup(), $.ajaxPrefilter(), $.ajaxTransport() dan $.holdReady(), pembangun boleh berkongsi konfigurasi mereka antara berbilang halaman, praproses permintaan AJAX dan mendaftar AJAX Transport tersuai dan mengawal jQuery's ready peristiwa. Pilihan ini meningkatkan produktiviti, meningkatkan prestasi tapak web dan menjadikan pelaksanaan aplikasi web yang kompleks lebih cekap.

Atas ialah kandungan terperinci tetapan global jquery. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn