oninvalid- Ereignis
Beispiel
Benachrichtigen Sie einen Text, wenn ein Eingabefeld ungültig ist:
<input type="text" oninvalid="alert('You must fill out the form!');" required>
Weitere „Probieren Sie es selbst“-Beispiele weiter unten.
Definition und Verwendung
Das oninvalid-Ereignis tritt auf, wenn ein absendebares <input>-Element ungültig ist.
Beispielsweise ist das Eingabefeld ungültig, wenn das erforderliche Attribut gesetzt und das Feld leer ist (das erforderliche Attribut gibt an, dass das Eingabefeld vor dem Absenden des Formulars ausgefüllt werden muss).
Browser-Unterstützung
Die Zahlen in der Tabelle geben die erste Browserversion an, die das Ereignis vollständig unterstützt.
Event | |||||
---|---|---|---|---|---|
oninvalid | Yes | 10.0 | Yes | Yes | Yes |
Syntax
Im HTML-Format:
<element oninvalid="myScript">
In JavaScript:
object.oninvalid = function(){myScript};
Verwenden Sie in JavaScript die Methode addEventListener():
object.addEventListener("invalid", myScript);
Hinweis: Die Methode addEventListener() wird in Internet Explorer 8 und früheren Versionen nicht unterstützt.
Technische Details
Bläschen: | Nein |
---|---|
kündbar: | ja |
Ereignistyp: | Fall |
Unterstützte HTML-Tags: | <Eingabe> |
DOM-Version: | Ereignisse der Ebene 3 |
Mehr Beispiele
Beispiel
Benachrichtigen Sie einen Text, wenn ein Eingabefeld weniger als 6 Zeichen enthält:
Name: <input type="text" id="myInput" name="fname" pattern=".{6,}"
required>
<script>
document.getElementById("myInput").addEventListener("invalid", myFunction);
function myFunction() {
alert("Must contain 6 or more characters");
}
</script>
Beispiel
Benachrichtigen Sie einen Text, wenn ein Eingabefeld eine Zahl enthält, die kleiner als 2 oder größer als 5 ist:
Number: <input type="number" id="myInput" name="quantity" min="2" max="5"
required>
<script>
document.getElementById("myInput").addEventListener("invalid", myFunction);
function myFunction() {
alert("You must pick a number between 2 and 5. You chose: " + this.value);
}
</script>
Verwandte Seiten
JavaScript-Tutorial: JavaScript-Formulare