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

Showing content from https://developer.cdn.mozilla.net/de/docs/Web/API/HTMLInputElement/valueAsNumber below:

HTMLInputElement: valueAsNumber-Eigenschaft - Web-APIs | MDN

Baseline Widely available

Die valueAsNumber-Eigenschaft des HTMLInputElement-Interfaces repräsentiert den aktuellen Wert des <input>-Elements als Zahl oder NaN, wenn eine Umwandlung in einen numerischen Wert nicht möglich ist.

Diese Eigenschaft kann auch direkt gesetzt werden, um beispielsweise einen Standardwert basierend auf einer Bedingung festzulegen.

Eine Zahl, die den Wert des Elements darstellt, oder NaN, wenn die numerische Konvertierung unmöglich ist.

In diesem Beispiel zeigt das Protokoll den aktuellen Wert des number-Eingabefelds, wenn es geändert wird.

Wir fügen ein <input> des Typs number und ein zugehöriges <label> sowie einen <pre>-Container für unsere Ausgabe ein.

<label for="number">Pick a number between 1 and 10:</label>

<input name="number" id="number" min="1" max="10" type="number" />

<pre id="log"></pre>

Das innerText des <pre>-Elements wird bei jedem change-Ereignis auf den aktuellen Wert des <input>-Elements aktualisiert.

const logElement = document.getElementById("log");
const inputElement = document.getElementById("number");

inputElement.addEventListener("change", () => {
  logElement.innerText = `Number: ${inputElement.valueAsNumber}`;
});

#log {
  height: 20px;
  padding: 0.5rem;
  background-color: #ededed;
}

Wenn Sie die Zahl im Widget löschen, ist das Ergebnis NaN.

Dieses Beispiel demonstriert die valueAsNumber-Eigenschaft eines <input> mit dem Typ datetime-local.

Wir fügen ein <input> des Typs datetime-local ein:

<label for="date">Pick a date and time:</label>

<input name="date" id="date" type="datetime-local" />

<pre id="log"></pre>

Wenn kein Datum oder keine Uhrzeit ausgewählt ist, ergibt der leere String NaN. Jedes Mal, wenn eine Auswahl getroffen wird, wird ein change-Ereignis ausgelöst, das den Inhalt des <pre>-Elements aktualisiert und den HTMLInputElement.value des Formularelements im Vergleich zu diesem Wert als Zahl anzeigt.

const logElement = document.getElementById("log");
const inputElement = document.getElementById("date");

logElement.innerText = `Initial value: ${inputElement.valueAsNumber}`;

inputElement.addEventListener("change", () => {
  const d = new Date(inputElement.valueAsNumber);
  logElement.innerText = `${inputElement.value} resolves to ${inputElement.valueAsNumber}, \nwhich is ${d.toDateString()} at ${d.toTimeString()}`;
});

#log {
  height: 20px;
  padding: 0.5rem;
  background-color: #ededed;
}

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