您的位置:

input只允许输入数字

一、input只允许输入数字和冒号

在开发中,我们有时需要让用户输入时间,此时需要使用input元素并限制输入的字符,比如只允许输入数字和冒号,代码如下:

<input type="text" pattern="[0-9:]*" />

上面的代码中,pattern属性使用正则表达式限制了只能输入数字和冒号。

二、input只准输入数字

有时候需要让用户输入数字,但是有些用户可能会误输入其他字符。我们可以使用type属性为number的input元素来限制只能输入数字,代码如下:

<input type="number" />

上面的代码中,type属性为number会自动禁止输入非数字字符。

三、input只允许输入数字和字母

有些场景需要用户输入数字和字母,可以使用pattern属性限制只允许输入数字和字母,代码如下:

<input type="text" pattern="[0-9a-zA-Z]*" />

上面的代码中,pattern属性使用正则表达式限制了只能输入数字和字母。

四、input只允许输入数字和一个小数点

有时候需要用户输入数字和小数点,但是不能输入其他内容,可以使用pattern属性限制只允许输入数字和一个小数点,代码如下:

<input type="text" pattern="\d+(\.\d{1,2})?" />

上面的代码中,pattern属性中\d+表示至少输入一个数字,(\.\d{1,2})?表示小数点和小数部分可选,小数部分最多两位。

五、html只允许输入数字

在HTML中,可以使用input元素和type属性为tel来限制只能输入数字,代码如下:

<input type="tel" />

上面的代码中,type属性为tel会自动禁止输入非数字字符。

六、input只允许输入正整数

如果只需要用户输入正整数,可以使用type属性为number并限制最小值为1,代码如下:

<input type="number" min="1" />

上面的代码中,min属性限制最小值为1,所以用户输入正整数时,不能小于1。

七、正则表达式只允许输入数字

使用正则表达式可以对输入的内容进行更加复杂的限制。如果需要只允许输入数字,可以使用以下正则表达式:

/^\d*$/

上面的正则表达式中,^\d*$表示只能输入数字。

八、文本框只允许输入数字和英文

如果需要文本框只允许输入数字和英文,可以使用以下代码:


上面的代码中,使用了onkeyup事件和value.replace函数,将非数字和非英文字符替换为空。

九、input只允许输入数字和小数点

有时候需要用户输入数字和小数点,但是不能输入其他内容,可以使用以下代码:

<input type="text" onkeyup="value=value.replace(/[^\d\.]/g,'')" />

上面的代码中,使用了onkeyup事件和value.replace函数,将非数字和非小数点字符替换为空。