Bagaimana untuk Mencegah Penyerahan Borang Berganda dalam jQuery?

Mencegah Penyerahan Semula Borang dalam jQuery

Dalam penyerahan borang, adalah penting untuk menghalang pengguna daripada menghantar dua kali secara tidak sengaja semasa kelewatan pemprosesan pelayan. Penyelesaian biasa melibatkan melumpuhkan elemen borang semasa penyerahan. Walau bagaimanapun, pendekatan ini mungkin melumpuhkan elemen yang tidak sepatutnya, seperti input yang mengandungi data penting.

Lumpuhkan Hanya Butang Hantar

Untuk melumpuhkan butang serah secara khusus dan elakkan gangguan dengan penyerahan borang, gunakan kod berikut:

$('button[type=submit], input[type=submit]').prop('disabled',true);

Pemalam jQuery untuk Pencegahan Penyerahan Berganda

Satu lagi penyelesaian berkesan ialah mencipta pemalam jQuery yang menggunakan data( ) berfungsi untuk menandakan borang sebagai telah diserahkan:

jQuery.fn.preventDoubleSubmission = function() {
    $(this).on('submit',function(e){
        var $form = $(this);

        if ($form.data('submitted') === true) {
            // Previously submitted - don't submit again
            e.preventDefault();
        } else {
            // Mark it so that the next submit can be ignored
            $form.data('submitted', true);
        }
    });

    // Keep chainability
    return this;
};

Untuk menggunakan pemalam, hanya gunakannya pada borang anda:

$('form').preventDoubleSubmission();

Tidak Termasuk Borang Ajax

Jika anda mempunyai borang AJAX yang memerlukan berbilang penyerahan, kecualikan borang tersebut dengan menambah kelas dan menggunakan pemilih berikut:

$('form:not(.js-allow-double-submission)').preventDoubleSubmission();

Dengan menggunakan teknik ini, anda boleh menghalang penyerahan borang dua kali dan memastikan pelayan lancar pemprosesan.

Atas ialah kandungan terperinci Bagaimana untuk Mencegah Penyerahan Borang Berganda dalam jQuery?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!