JSFiddle - React, Tailwind, and code Playground

by adeneo

HTML

<p>HTML 5 input with numbers only, buttons can be removed!</p>

<input type="number" /><br /><br />

<p>Using isNaN!</p>
<input id="number1" /><br /><br />

<p>Filtering with regex!</p>
<input id="number2" /><br /><br />

<p>Filtering with regex and using isNaN!</p>
<input id="number3" />

JavaScript

$("#number1").on('keyup', function() {
    var myval = $(this).val();
    if (isNaN(myval)) {
        alert('numbers only!');
    }
});

var P;
$("#number2").on('keyup', function() {
    var V = $(this).val();
    if (V != P) {
        $(this).val(V.replace(/[^0-9]/g,''));
    }
    P=V;
});


$("#number3").on('keyup', function() {
    var V = $(this).val();
    if (isNaN(V)) {
        $(this).val(V.replace(/[^0-9]/g,''));
    }
});