Bagaimana untuk Mencegah Penyerahan Borang dengan Kunci ENTER?

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!