Restrict Input to Numbers: 2 Easy Solutions

Solution 1: Use the type attribute of the input element in HTML5 to specify type as number
By setting the type attribute of the input element to number, you can restrict users to input only numeric values. For example:

<input type="number" />

Users can only input numbers in this text box, and if any non-numeric characters are entered, the browser will automatically filter them out.

Solution 2: Use event listening in JavaScript and regular expression matching
One option is to use JavaScript to listen for input events in a text box and use regular expressions to determine if the user input is a number. For example:

<input type="text" id="textbox" />

<script>
    var textbox = document.getElementById("textbox");
    textbox.addEventListener("input", function() {
        var value = textbox.value;
        value = value.replace(/[^\d]/g, ""); // 使用正则表达式匹配非数字字符并替换为空字符串
        textbox.value = value;
    });
</script>

This way, when a user enters characters in the text box, it will trigger an input event, then use a regular expression to match non-numeric characters and replace them with an empty string, finally assigning the processed string back to the text box. This ensures that the user can only input numeric characters.