mata teras

Fungsi pembantu utiliti jquery Ajax ini boleh digunakan untuk menyimpan data secara tempatan pada objek JavaScript, atau untuk menjalankan fungsi panggilan balik JavaScript secara dinamik apabila Ajax berjaya. Fungsi utiliti ini mengurangkan keperluan untuk menulis fungsi AJAX dalam pelbagai fail dan menyimpan panggilan definisi AJAX di satu tempat.
Fungsi pembantu utiliti Ajax ini fleksibel dan berkuasa, membolehkan pemaju menentukan pelbagai tetapan untuk permintaan Ajax dalam panggilan fungsi tunggal. Ia boleh digunakan dengan perpustakaan JavaScript yang lain, tetapi penjagaan harus diambil untuk mengelakkan konflik yang berpotensi.
Fungsi penolong utiliti AJAX ini boleh mengendalikan kesilapan menggunakan pilihan panggil balik ralat. Ia juga boleh menghantar data ke pelayan, memuat data JSON, membatalkan permintaan AJAX, menghantar fail ke pelayan, dan membuat permintaan Ajax segerak, walaupun yang terakhir biasanya tidak disyorkan kerana kemungkinan penyebaran pelayar dan memperlahankan kelajuan tindak balas aplikasi web.

Selamat pagi untuk semua pencinta jQuery! Hari ini, saya akan berkongsi dengan anda fungsi Ajax Helper pendek yang saya tulis yang boleh menerima beberapa tetapan Ajax asas dan menyimpan data pada objek JavaScript, atau menjalankan panggilan balik JavaScript secara dinamik apabila Ajax berjaya. Menggunakan fungsi utiliti AJAX akan menjimatkan masa anda menulis fungsi AJAX dalam pelbagai fail. Ia juga boleh menyimpan panggilan definisi Ajax anda di satu tempat jika anda memerlukan keperluan khusus untuk Ajax (seperti menambah imej pemuatan atau pengendali ralat tertentu). Artikel Berkaitan: - 6 Contoh masa nyata JQuery Ajax - Perbezaan antara Get dan Pos di JQuery Ajax

fungsi pembantu utiliti Ajax

Fungsi Ajax Helper ini boleh dimasukkan ke dalam objek utiliti JavaScript anda.

/**
 *  JQUERY4U.COM
 *
 *  為其他JavaScript對(duì)象提供實(shí)用程序函數(shù)。
 *
 *  @author      Sam Deering
 *  @copyright   Copyright (c) 2012 JQUERY4U
 *  @license     http://jquery4u.com/license/
 *  @since       Version 1.0
 *  @filesource  js/jquery4u.util.js
 *
 */

(function($,W,D)
{
    W.JQUERY4U = W.JQUERY4U || {};

    W.JQUERY4U.UTIL =
    {
        /**
          * AJAX輔助函數(shù)，可用于動(dòng)態(tài)存儲(chǔ)數(shù)據(jù)或在成功后運(yùn)行函數(shù)。
          * @param callback - 'store' 用于本地存儲(chǔ)數(shù)據(jù)，'run' 用于運(yùn)行回調(diào)函數(shù)。
          * @param callbackAction - 數(shù)據(jù)存儲(chǔ)位置。
          * @param subnamespace - 數(shù)據(jù)存儲(chǔ)/函數(shù)運(yùn)行的命名空間。
          */
        ajax: function(type, url, query, async, returnType, data, callback, callbackAction, subnamespace)
        {
            $.ajax(
            {
                type: type,
                url: url + query,
                async: async,
                dataType: returnType,
                data: data,
                success: function(data)
                {
                    switch(callback)
                    {
                    case 'store':
                      JQUERY4U[subnamespace]["data"][callbackAction] = data; //存儲(chǔ)數(shù)據(jù)
                      break;
                    case 'run':
                      JQUERY4U[subnamespace][callbackAction](data); //使用數(shù)據(jù)運(yùn)行函數(shù)
                      break;
                    default:
                      return true;
                    }
                },
                error: function(xhr, textStatus, errorThrown)
                {
                    alert('ajax加載錯(cuò)誤...');
                    return false;
                }
            });
         }
    }

})(jQuery,window,document);

cara menggunakan fungsi utiliti ajax

Berikut adalah contoh cara menggunakan fungsi utiliti AJAX: 1) Dapatkan data dengan Ajax dan simpannya pada objek JS anda 2) Dapatkan data dengan AJAX dan menjalankan fungsi panggilan balik yang melewati data

/**
 *  JQUERY4U.COM
 *
 *  使用AJAX實(shí)用程序函數(shù)的示例JavsScript對(duì)象。
 *
 *  @author      Sam Deering
 *  @copyright   Copyright (c) 2012 JQUERY4U
 *  @license     http://jquery4u.com/license/
 *  @since       Version 1.0
 *  @filesource  js/jquery4u.module.js
 *
 */

(function($,W,D)
{
    W.JQUERY4U = W.JQUERY4U || {};

    W.JQUERY4U.MODULE =
    {
        data:
        {
            ajaxData: '' //用于存儲(chǔ)ajax數(shù)據(jù)
        },

        init: function()
        {
            this.getData(); //存儲(chǔ)數(shù)據(jù)測(cè)試
            this.runFunc(); //運(yùn)行函數(shù)測(cè)試
        },

        //調(diào)用ajax并在ajax成功后保存數(shù)據(jù)的示例函數(shù)
        getData: function()
        {
            JQUERY4U.UTIL.ajax('GET', 'jquery4u.com/data.php', '?param=value&param2=value2', false, 'HTML', '', 'store', 'ajaxData', 'MODULE');
            //ajax數(shù)據(jù)在ajax成功后存儲(chǔ)在JQUERY4U.MODULE.data.ajaxData中
        },

        //調(diào)用ajax并在ajax成功后運(yùn)行函數(shù)的示例函數(shù)
        runFunc: function()
        {
            var data = ['傳遞給服務(wù)器端腳本的一些數(shù)據(jù)'];
            JQUERY4U.UTIL.ajax('POST', 'jquery4u.com/data.php', '', true, 'HTML', data, 'run', 'ajaxCallbackFunction', 'MODULE');
            //JQUERY4U.MODULE.ajaxCallbackFunction在ajax成功后被調(diào)用
        },

        //ajax成功后調(diào)用的函數(shù)
        ajaxCallbackFunction: function(data)
        {
            //對(duì)返回的數(shù)據(jù)執(zhí)行某些操作
        }
    }

    $(D).ready(function() {
        JQUERY4U.MODULE.init();
    });

})(jQuery,window,document);

Fungsi Ajax ini berfungsi dengan sempurna, tetapi ia masih dalam pembangunan dan saya tweakingnya jadi saya akan cuba mengekalkan kod yang dikemas kini.

Soalan Lazim mengenai JQuery Ajax Utility Helper Functions (FAQ)

Apakah fungsi pembantu utiliti jQuery Ajax dan bagaimana ia berfungsi?

Fungsi JQuery Ajax Utility Helper adalah alat yang berkuasa yang membolehkan pemaju membuat aplikasi web tak segerak. Ia berfungsi dengan menghantar permintaan HTTP ke pelayan dan menerima respons tanpa perlu memuatkan semula keseluruhan halaman. Fungsi ini amat berguna dalam meningkatkan pengalaman pengguna, kerana ia membolehkan membuat aplikasi web yang lebih cepat dan lebih interaktif.

Bagaimana menggunakan fungsi pembantu utiliti jQuery Ajax dalam kod saya?

Untuk menggunakan fungsi JQuery Ajax Utility Helper, anda perlu memasukkan Perpustakaan JQuery dalam fail HTML. Anda kemudian boleh menggunakan kaedah $ .ajax () untuk menghantar permintaan tak segerak ke pelayan. Kaedah ini mengambil objek pilihan sebagai parameter di mana anda boleh menentukan butiran, seperti URL untuk menghantar permintaan, jenis permintaan (mendapatkan, pos, dll), jenis data respons, dan fungsi panggil balik untuk memproses respons.

JQuery Apakah perbezaan utama antara fungsi penolong utiliti AJAX dan kaedah Ajax yang lain?

fungsi pembantu utiliti jQuery Ajax lebih fleksibel dan berkuasa daripada kaedah Ajax yang lain. Ia membolehkan anda menentukan pelbagai tetapan untuk permintaan AJAX dalam satu panggilan fungsi. Kaedah Ajax lain seperti $ .get () dan $ .post () adalah lebih mudah dan lebih mudah digunakan, tetapi mempunyai fleksibiliti yang lemah dan kawalan yang lebih lemah.

Bolehkah saya menggunakan fungsi pembantu utiliti jQuery Ajax dengan perpustakaan JavaScript yang lain?

Ya, anda boleh menggunakan fungsi penolong utiliti jQuery Ajax dengan perpustakaan JavaScript yang lain. Walau bagaimanapun, anda perlu menyedari kemungkinan konflik antara JQuery dan perpustakaan lain. Untuk mengelakkan konflik, anda boleh menggunakan kaedah Noconflict () JQuery, yang membolehkan anda membuat alias baru untuk jQuery dan membebaskan simbol $ untuk digunakan oleh perpustakaan lain.

Bagaimana menangani kesilapan dalam fungsi penolong utiliti jQuery Ajax?

Anda boleh menggunakan pilihan panggil balik ralat untuk mengendalikan kesilapan dalam fungsi pembantu utiliti jQuery Ajax. Jika permintaan AJAX gagal, fungsi ini dipanggil. Ia menerima tiga parameter: objek JQXHR, rentetan yang menerangkan jenis ralat, dan (jika ia berlaku) objek pengecualian pilihan.

Bagaimana menggunakan fungsi pembantu utiliti jQuery Ajax untuk menghantar data ke pelayan?

Anda boleh menggunakan pilihan data dalam fungsi pembantu utiliti JQuery AJAX untuk menghantar data ke pelayan. Pilihan ini membolehkan anda menentukan data untuk dihantar ke pelayan sebagai rentetan, objek biasa, atau array JavaScript.

Bolehkah saya memuatkan data JSON menggunakan fungsi penolong utiliti jQuery Ajax?

Ya, anda boleh memuatkan data JSON menggunakan fungsi pembantu utiliti jQuery Ajax. Anda boleh menentukan jenis data respons sebagai "JSON" dalam objek Pilihan dan jQuery secara automatik akan menghuraikan data JSON untuk anda.

bagaimana membatalkan permintaan Ajax dalam jQuery?

Anda boleh membatalkan permintaan AJAX dalam jQuery dengan memanggil kaedah abort () objek JQXHR yang dikembalikan oleh kaedah $ .ajax (). Ini akan segera menamatkan permintaan dan mencetuskan panggilan balik ralat.

Bolehkah saya menghantar fail ke pelayan menggunakan fungsi pembantu utiliti jQuery Ajax?

Ya, anda boleh menggunakan fungsi pembantu utiliti jQuery Ajax untuk menghantar fail ke pelayan. Anda perlu menetapkan pilihan ProcessData untuk palsu untuk mengelakkan jQuery daripada menukar data ke rentetan pertanyaan dan pilihan ContentType untuk palsu untuk mengelakkan jQuery daripada menetapkan jenis kandungan lalai untuk permintaan.

Bagaimana menggunakan jQuery untuk menyegerakkan permintaan AJAX?

Walaupun secara amnya disyorkan untuk menggunakan permintaan Ajax tak segerak untuk pengalaman pengguna yang lebih baik, anda boleh menyegerakkan permintaan AJAX dalam jQuery dengan menetapkan pilihan Async untuk palsu dalam objek pilihan. Walau bagaimanapun, sedar bahawa permintaan segerak boleh menyekat penyemak imbas dan melambatkan respons aplikasi web anda.

Atas ialah kandungan terperinci fungsi penolong utiliti jQuery ajax. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!