Rumah > hujung hadapan web > tutorial js > Bagaimanakah Saya Boleh Memintas dan Menghalang Penyerahan Borang Menggunakan JavaScript?

Bagaimanakah Saya Boleh Memintas dan Menghalang Penyerahan Borang Menggunakan JavaScript?

Barbara Streisand
Lepaskan: 2024-12-27 17:58:15
asal
604 orang telah melayarinya

How Can I Intercept and Prevent Form Submissions Using JavaScript?

Memintas Penyerahan Borang untuk Pencegahan

Dalam situasi di mana anda mempunyai borang dengan butang hantar sedia ada yang tidak boleh diubah suai, menghalang penyerahannya boleh dicapai melalui JavaScript.

Untuk menangkap acara serahan dan mengelakkannya daripada berlaku, langkah berikut boleh diambil:

Menangkap Acara Serah:

  1. Cari elemen borang:

    const form = document.querySelector('form');
    Salin selepas log masuk
  2. Tambahkan pendengar acara pada borang untuk 'serahkan' acara:

    form.addEventListener('submit', handleSubmit);
    Salin selepas log masuk

Menghalang Penyerahan:

Dalam fungsi pengendali acara ('handleSubmit' dalam kes ini), anda boleh menghalang tindakan serahkan oleh:

  1. Memanggil preventDefault() pada acara objek:

    const handleSubmit = (e) => {
      e.preventDefault();
    };
    Salin selepas log masuk
  2. Selain itu, untuk penyerahan borang AJAX, mengembalikan palsu seterusnya menghalang tindakan borang lalai:

    function handleSubmit(e) {
      e.preventDefault();
      // Insert your custom logic here
      return false;
    };
    Salin selepas log masuk

Nota: Seperti yang diserlahkan dalam jawapan yang disediakan, jika ralat JavaScript berlaku sebelum penyataan palsu kembali, borang masih akan diserahkan. Untuk menangani perkara ini, pertimbangkan untuk menggunakan try...catch block untuk mengendalikan sebarang kemungkinan ralat dan memastikan borang tidak diserahkan walaupun dalam kes sedemikian.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Memintas dan Menghalang Penyerahan Borang Menggunakan JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
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
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan