HTML-Texteingabe erlaubt nur numerische Eingaben

Question

Gibt es eine schnelle Möglichkeit, eine HTML-Texteingabe ( <input type=text /> ), um nur numerische Tastenanschläge (plus '.') zuzulassen?

Answer 1

Eine einfache Möglichkeit, dieses Problem zu lösen, ist die Implementierung einer jQuery-Funktion zur Validierung der in das Textfeld eingegebenen Zeichen mit Regex:

Ihr html-Code:

<input class="integerInput" type="text">

Und die js-Funktion mit jQuery

$(function() {
    $('.integerInput').on('input', function() {
      this.value = this.value
        .replace(/[^\d]/g, '');// numbers and decimals only

    });
});

$(function() {
        $('.integerInput').on('input', function() {
          this.value = this.value
            .replace(/[^\d]/g, '');// numbers and decimals only

        });
    });

<script
              src="https://code.jquery.com/jquery-2.2.4.min.js"
              integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44="
              crossorigin="anonymous">
</script>

<input type="text" class="integerInput"/>

Answer 2

input type="number" ist ein HTML5-Attribut.

Im anderen Fall wird Ihnen dies helfen:

function isNumberKey(evt){
    var charCode = (evt.which) ? evt.which : evt.keyCode
    if (charCode > 31 && (charCode < 48 || charCode > 57))
        return false;
    return true;
}

<input type="number" name="somecode" onkeypress="return isNumberKey(event)"/>

Answer 3

Nur eine andere Variante mit jQuery unter Verwendung von

$(".numeric").keypress(function() {
    return (/\d/.test(String.fromCharCode(event.which) ))
});

Answer 4

Ich habe einige großartige Antworten gesehen, aber ich mag sie so klein und einfach wie möglich, damit vielleicht jemand davon profitieren kann. Ich würde javascript verwenden Number() y isNaN Funktionalität wie diese:

if(isNaN(Number(str))) {
   // ... Exception it is NOT a number
} else {
   // ... Do something you have a number
}

Ich hoffe, das hilft.

Answer 5

<input name="amount" type="text" value="Only number in here"/> 

<script>
    $('input[name=amount]').keyup(function(){
        $(this).val($(this).val().replace(/[^\d]/,''));
    });
</script>