Gibt es eine Möglichkeit zu verhindern, dass input type="number" negative Werte erhält?

Question

Ich möchte nur positive Werte erhalten. Gibt es eine Möglichkeit, dies zu verhindern, indem ich nur html
Bitte schlagen Sie keine Validierungsmethode vor

Answer 1

Verwenden Sie die min Attribut wie diese:

<input type="number" min="0">

Answer 2

Für mich war das die Lösung:

<input type="number" min="0" oninput="this.value = Math.abs(this.value)">

Modifier

Wie in den Kommentaren vorgeschlagen, mit einer kleinen Änderung, damit es funktioniert, wenn 0 der Mindestwert ist.

<input type="number" min="0" oninput="this.value = 
 !!this.value && Math.abs(this.value) >= 0 ? Math.abs(this.value) : null">

Answer 3

Ich war nicht zufrieden mit @Abhrabm Antwort denn:

Es wurde nur verhindert, dass negativ die Eingabe von Nummern aus Pfeile nach oben/unten, während der Benutzer negative Zahlen über die Tastatur eingeben kann.

Die Lösung ist die Vorbeugung mit Tastencode :

// Select your input element.
var number = document.getElementById('number');

// Listen for input event on numInput.
number.onkeydown = function(e) {
    if(!((e.keyCode > 95 && e.keyCode < 106)
      || (e.keyCode > 47 && e.keyCode < 58) 
      || e.keyCode == 8)) {
        return false;
    }
}

<form action="" method="post">
  <input type="number" id="number" min="0" />
  <input type="submit" value="Click me!"/>
</form>

Klärung durch @Hugh Guiney :

Welche Schlüsselcodes geprüft werden:

• 95, < 106 entspricht dem Numpad 0 bis 9;
• 47, < 58 entspricht 0 bis 9 in der Zahlenreihe; und 8 ist Rücktaste.

Dieses Skript verhindert also, dass ein ungültiger Schlüssel in die Eingabe eingegeben wird.

Answer 4

Dieser Code funktioniert bei mir einwandfrei. Können Sie bitte überprüfen:

<input type="number" name="test" min="0" oninput="validity.valid||(value='');">

Answer 5

Einfache Methode:

<input min='0' type="number" onkeypress="return (event.charCode == 8 || event.charCode == 0) ? null : event.charCode >= 48 && event.charCode <= 57">