Bagaimanakah Saya Boleh Menghalang Penyerahan Borang Apabila Menekan Kekunci Enter?

Mary-Kate Olsen
Lepaskan: 2024-11-27 00:00:18
asal
479 orang telah melayarinya

How Can I Prevent Form Submission When Pressing the Enter Key?

Halang Penyerahan Borang dengan Kunci Enter

Apabila bekerja dengan borang, ia boleh mengecewakan apabila menekan kekunci Enter mencetuskan penyerahan dan bukannya melaksanakan fungsi JavaScript yang dikehendaki. Untuk menyelesaikan masalah ini, adalah perlu untuk menghalang borang daripada diserahkan sebagai respons kepada tekan kekunci Enter.

Satu kaedah yang berkesan ialah menggunakan pendengar acara JavaScript. Dengan melampirkan fungsi pada acara penekan kekunci, anda boleh mengendalikan gelagat penekan kekunci dan menghalang borang daripada diserahkan. Begini cara untuk melakukannya:

document.addEventListener("keypress", function(e) {
  if (e.keyCode == 13) {
    // Call the desired JavaScript function here
    // ...
    
    // Prevent form submission
    e.preventDefault();
  }
});
Salin selepas log masuk

Dalam kod ini:

  • document.addEventListener mendengar acara "penekanan kekunci".
  • e.keyCode == 13 menyemak sama ada kekunci yang ditekan ialah kekunci Enter.
  • Jika kekunci Enter ditekan, fungsi JavaScript yang diingini dilaksanakan.
  • e.preventDefault() menghalang borang daripada diserahkan.

Dengan melaksanakan kod ini, anda boleh melumpuhkan penyerahan borang apabila kekunci Enter ditekan dan ubah hala tindakan kepada fungsi JavaScript tersuai sebaliknya.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menghalang Penyerahan Borang Apabila Menekan Kekunci Enter?. 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