HTML JS Input Feld leer?

2 Antworten

Bisschen schwammig, aber Du könntest es so machen:

HTML:
<input type="text" id="id">

JS
if (document.getElementById('id').value == '') {

...

}

Vielen Dank :)

1

Ich vermute mal, es soll ein Eingabefeld in einem <form> validiert werden. Das funktioniert so:

Javascript

const form  = document.getElementById("my-form");
const field = document.getElementById("my-field");

form.addEventListener("submit", ev => {
    if (field.value.trim() === "") {
        ev.preventDefault();
        alert("Feld darf nicht leer sein!");
    }
});

Html

<form id="my-form" action="http://www.example.com">
    <input id="my-field" type="text" name="hi">
    <input type="submit" value="Absenden!">
</form>

Im Script wird ein Event Listener zum Formular hinzugefügt. Dieses löst ein Event aus, wenn es abgesendet wird. Dabei überprüfen wir, ob das Feld mit der ID "my-field" leer ist. Falls ja, wird das Event mit ev.preventDefault() abgebrochen, d.h. das Formular wird nicht abgesendet, und eine Fehlermeldung wird mit alert() ausgegeben.

Beachte, dass durch field.value.trim() das Eingabefeld auch dann als leer zählt, wenn es Leerzeichen enthält (Die Methode trim() entfernt Leerzeichen am Anfang und am Ende eines Strings).

Woher ich das weiß:Studium / Ausbildung – Informatikstudium

PS: Eine noch einfachere Methode geht so:

<input type="text" name="hi" required>

Durch das required verhindert der Browser, dass das Formular abgesendet wird, falls der Input leer ist. Es wird aber abgesendet, wenn es Leerzeichen enthält.

0

Was möchtest Du wissen?