仅为正整数的HTML输入(类型=数字)

Question

我找不到合适的正则表达式模式,即使这类问题很多.

我不希望用户能够输入或输入

<td><input type="number" pattern=" 0+\.[0-9]*[1-9][0-9]*$" name="itemConsumption" /></td>

1. -1.0(负值)
2. 字符串值和任何字符
3. 1.0(十进制值)
4. 没有范围限制

我只想接受积极的整数

解决不需要正则表达式,我不知道这个:D

<td><input type="number" pattern=" 0+\.[0-9]*[1-9][0-9]*$" name="itemConsumption" onkeypress="return event.charCode >= 48 && event.charCode <= 57"</td> 

Answer 1

要拨打任何输入但数字,您可以使用

<input type="text" onkeypress="return (event.charCode == 8 || event.charCode == 0 || event.charCode == 13) ? null : event.charCode >= 48 && event.charCode <= 57" name="itemConsumption" />
                   ^------------....

<form id="mfrm">
<table>
    <tr>
        <td>Enter number only: <input type="text" name="itemConsumption" onkeypress="return (event.charCode == 8 || event.charCode == 0 || event.charCode == 13) ? null : event.charCode >= 48 && event.charCode <= 57" /></td>
        <td><input type="Submit"/></td>
    </tr>
</table>

这里,event.charCode == 8 || event.charCode == 0 || event.charCode == 13条件处理按下DELETE,BACKSPACE或ENTER键的情况(对于Firefox很重要,请参阅下面的Mohit评论和datashaman与启用ENTER键相关的注释).

的event.charCode >= 48 && event.charCode <= 57手段,只有0(十进制代码48)和所有其他数字多达9(十进制代码57)将被返回.

Answer 2

如果涉及到 HTML5，那么您可以尝试min属性：

<input type="number" min="0">

Answer 3

要仅允许数字值,您可以使用如下:

<td><input type="number" pattern="\d+" name="itemConsumption" /></td>

Answer 4

您可以使用type，min和oninput

<input type="number" min="0" step="1" oninput="validity.valid||(value='');">

<input type="number" min="0" step="1" oninput="validity.valid||(value='');">

Answer 5

我尝试了很多不同的解决方案来实现这一目标，最后我想出了这个，它完美地完成了我们的工作。它适用于打字和复制/粘贴，我找不到任何不需要的副作用。

<form>
    <input
        type="number"
        min="0"
        step="1"
        onfocus="this.previousValue = this.value"
        onkeydown="this.previousValue = this.value"
        oninput="validity.valid || (value = this.previousValue)"
    />
</form>

这就像 Nikhil Mahirrao 的解决方案，但它会导致无效的击键被简单地忽略而不清空输入。