js 屏蔽非数字字符输入

在有输入字符为数字字符的需求时,首先想到的是设置 input 的 type 为 number / tel,原因见之前的 移除input number的上下箭头  。

好巧不巧的时,在最见的项目中,碰到了这种需求,于是很自然的将 input 的 type 设为 tel; 然而。。。。

????心里一顿 mmp,说好的只能输入数字呢?我一定是使用了假的 Chrome 浏览器。。。

然后,向同事大佬请教后,HTML5中的一些属性兼容性还是比较差的,input 正好是其中之一。so,为了浏览器的兼容性,那么最佳方案是通过 js 正则来判断了。。

function isNum(val) {
    if (val < 48 || val > 57) {
        return false;
    } else {
        return true;
    }
}

$("input").keydown(function (e) {
    return isNum(e.keyCode);
})

此时,即对每一次的输入都会做相应的正则判断。如果想要添加一些提示等,只需追加相应的事件即可。

还注意的是:这种方法会将 backspace 和 enter 也屏蔽掉,需要注意添加上去

原文地址:https://www.cnblogs.com/intangible/p/7889497.html