A RetroSearch Logo

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

Search Query:

Showing content from http://developer.mozilla.org/de/docs/Web/API/HTMLInputElement/valueAsNumber below:

HTMLInputElement: valueAsNumber-Eigenschaft - Web-APIs | MDN

HTMLInputElement: valueAsNumber-Eigenschaft

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.

Wert

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

Beispiele Abrufen eines Zahlenwertes

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

HTML

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>
JavaScript

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

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

Abrufen eines Datumswertes als Zahl

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

HTML

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>
JavaScript

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;
}
Ergebnisse Spezifikationen Browser-Kompatibilität Siehe auch MDN-Feedback-Box War diese Übersetzung hilfreich?

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