Question

我有一个数字类型输入，我想阻止人们输入任何数字。我发现的示例适用于输入类型文本字段，但不适用于数字字段。

运作良好：）

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

效果不佳：（

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

在JSFiddle

上亲自试用

请帮忙......

Answer 1

我刚刚使用JSFiddle进行了一些简单的测试，看来如果<input type="number" />元素上的输入无效，则this.value属性将返回空白。

使用Chrome时，以下行显示了此结果：

<input type="number" oninput="alert(this.value)">

JSFiddle Demo

事实上，这就是发生这种情况的原因：

value属性（如果已指定且非空）必须具有值   这是一个有效的浮点数。

值清理算法如下：如果值为   element不是有效的浮点数，然后将其设置为空   而不是字符串。

^来自HTML5 Draft Paper section on the implementation of the number input type

这个问题现在引起了我的兴趣，我已经提出了一些解决方法。

<input type="number" oninput="updateNum(this)">

function updateNum(e)
{
    e.select();
    e.value = getSelection().toString().replace(/[^\d]/g,'');
}

如果选择在命令之间进行更改，则可能会出错。

JSFiddle for the workaround

Answer 2

如果您想接受小数部分的数字（例如3.14），请参阅此DEMO

Number: <input type="number" oninput="updateNum(this)" />

function updateNum(e) {
if (isNaN(e.value)) {
    e.value = e.value.replace(/[^\d]/g,'');
}

正则表达式替换数字类型输入

2 个答案: