Rumah >hujung hadapan web >tutorial js >Bagaimana untuk Mencegah Penyerahan Borang dengan Kunci ENTER?

Bagaimana untuk Mencegah Penyerahan Borang dengan Kunci ENTER?

Barbara Streisand
Barbara Streisandasal
2024-11-07 18:50:03898semak imbas

How to Prevent Form Submission with the ENTER Key?

Halang Penyerahan Borang Web dengan Kunci ENTER

Menghalang kekunci ENTER daripada mencetuskan penyerahan borang adalah keperluan biasa dalam pembangunan web. Begini cara anda boleh melaksanakan tingkah laku ini dalam aplikasi berasaskan web:

Penyelesaian:

Untuk melumpuhkan penyerahan borang apabila ENTER menekan kekunci sambil mengekalkan tingkah laku textarea, gunakan kod berikut :

function checkEnter(e) {
    e = e || event;
    var txtArea = /textarea/i.test((e.target || e.srcElement).tagName);
    return txtArea || (e.keyCode || e.which || e.charCode || 0) !== 13;
}

Kemudian, tambahkan pengendali tekan kekunci pada borang:

document.querySelector('form').onkeypress = checkEnter;

Pendekatan Alternatif (Moden):

Yang lebih moden pendekatan menggunakan perwakilan acara adalah seperti berikut:

document.addEventListener(`keypress`, handle);

function handle(evt) {
    const form = evt.target.closest(`#testForm`);
    if (form) {
        if (evt.target.dataset.enterForSubmit) {
            if (evt.key === `Enter`) {
                evt.preventDefault();
                return logClear(`won't submit "${evt.target.value}"`);
            }
            return true;
        }
    }
}

Dalam kes ini, elemen HTML boleh dianotasi dengan data-enter-for-submit="1" untuk membenarkan penyerahan borang berasaskan ENTER secara terpilih.

Atas ialah kandungan terperinci Bagaimana untuk Mencegah Penyerahan Borang dengan Kunci ENTER?. 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