Wie verhindert man das Absenden eines Formulars mit der Eingabetaste?

Webformular-Übermittlung mit der Eingabetaste verhindern

Das Verhindern, dass das Drücken der Eingabetaste die Formularübermittlung auslöst, ist eine häufige Anforderung in der Webentwicklung. So können Sie dieses Verhalten in einer webbasierten Anwendung implementieren:

Lösung:

Um die Formularübermittlung beim Drücken der EINGABETASTE zu deaktivieren und gleichzeitig das Textbereichsverhalten beizubehalten, verwenden Sie den folgenden Code :

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;
}

Dann fügen Sie dem Formular einen Tastendruck-Handler hinzu:

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

Alternativer Ansatz (modern):

Ein modernerer Der Ansatz unter Verwendung der Ereignisdelegierung ist wie folgt:

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;
        }
    }
}

In diesem Fall können HTML-Elemente mit data-enter-for-submit="1" annotiert werden, um selektiv die ENTER-basierte Formularübermittlung zu ermöglichen.

Das obige ist der detaillierte Inhalt vonWie verhindert man das Absenden eines Formulars mit der Eingabetaste?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!