Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Showing content from https://developer.mozilla.org/de/docs/Web/API/ValidityState/rangeOverflow below:

ValidityState: rangeOverflow-Eigenschaft - Web-APIs | MDN

Baseline Widely available

Die schreibgeschützte rangeOverflow-Eigenschaft des ValidityState-Interfaces gibt an, ob der Wert eines <input>, nachdem er vom Benutzer bearbeitet wurde, nicht den durch das max-Attribut des Elements festgelegten Beschränkungen entspricht.

Wenn das Feld numerischer Natur ist, einschließlich der Typen date, month, week, time, datetime-local, number und range und ein max-Wert festgelegt ist, wird die rangeOverflow-Eigenschaft auf true gesetzt, wenn der Wert nicht den durch den max-Wert festgelegten Beschränkungen entspricht.

Ein boolescher Wert, der true ist, wenn der ValidityState nicht den Beschränkungen entspricht.

Das folgende Beispiel überprüft die Gültigkeit eines numerischen Eingabeelements. Mit Hilfe des max-Attributs wurde eine Beschränkung hinzugefügt, die einen maximalen Wert von 18 für die Eingabe festlegt. Wenn der Benutzer eine Zahl größer als 18 eingibt, schlägt die Überprüfung der Beschränkungen fehl, und die Stile, die den CSS-Pseudoklassen :invalid und :out-of-range entsprechen, werden angewendet.

/* or :invalid */
input:out-of-range {
  outline: red solid 3px;
}

body {
  margin: 0.5rem;
}
pre {
  padding: 1rem;
  height: 2rem;
  background-color: lightgrey;
  outline: 1px solid grey;
}

<pre id="log">Validation logged here...</pre>
<input type="number" id="age" max="18" />

const userInput = document.getElementById("age");
const logElement = document.getElementById("log");

function log(text) {
  logElement.innerText = text;
}

userInput.addEventListener("input", () => {
  userInput.reportValidity();
  if (userInput.validity.rangeOverflow) {
    log("Number is too high!");
  } else {
    log("Input is valid…");
  }
});

Diese Seite wurde automatisch aus dem Englischen übersetzt.

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4