How to limit the input box to only input pure numbers in HTML

How to limit the input box to only input pure numbers in HTML

Limit input box to only pure numbers

1、onkeyup = "value=value.replace(/[^\d]/g,'')"

There is bug when using the onkeyup event. In the Chinese input method, if you enter a Chinese character and then press Enter, the letter will be entered directly.

2、onchange = "value=value.replace(/[^\d]/g,'')"

When using onchange event, after entering content, the result will only be obtained when input loses focus, and it will not respond when entering.

3、oninput = "value=value.replace(/[^\d]/g,'')"

Using oninput event perfectly solves the above two problems, and no other problems have occurred in the test so far.

Code Sample

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <title>input</title>
</head>
<body>
    An input box that can only input pure numbers: <input type="text" name="" oninput="value=value.replace(/[^\d]/g,'')">
</body>
</html>

This is the end of this article about how to limit the input box in HTML to only input pure numbers. For more relevant HTML content about limiting input to numbers, please search 123WORDPRESS.COM's previous articles or continue to browse the following related articles. I hope you will support 123WORDPRESS.COM in the future!

<<:  Detailed explanation of the role of overflow:hidden (overflow hiding, clearing floats, solving margin collapse)

>>:  An example of implementing a simple finger click animation with CSS3 Animation

Recommend

Problems with using multiple single quotes and triple quotes in MySQL concat

When dynamically concatenating strings, we often ...

js simple and crude publish and subscribe sample code

What is Publish/Subscribe? Let me give you an exa...

JavaScript to achieve a simple message board case

Use Javascript to implement a message board examp...

Summary of some thoughts on binlog optimization in MYSQL

question Question 1: How to solve the performance...

Usage of if judgment in HTML

In the process of Django web development, when wr...

Search optimization knowledge to pay attention to in web design

1. Link layout of the new site homepage 1. The loc...

Tomcat components illustrate the architectural evolution of a web server

1. Who is tomcat? 2. What can tomcat do? Tomcat i...

Summary of common functions of PostgreSQL regular expressions

Summary of common functions of PostgreSQL regular...

JavaScript implements draggable progress bar

This article shares the specific code of JavaScri...

CSS3 uses var() and calc() functions to achieve animation effects

Preview knowledge points. Animation Frames Backgr...

Perfect solution to Google Chrome autofill problem

In Google Chrome, after successful login, Google ...

The most common declaration merge in TS (interface merge)

Table of contents 1. Merge interface 1.1 Non-func...

Why should you be careful with Nginx's add_header directive?

Preface As we all know, the nginx configuration f...

Vue realizes the logistics timeline effect

This article example shares the specific code of ...