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

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

js 屏蔽非数字字符输入

????心里一顿 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 也屏蔽掉,需要注意添加上去

 

相关文章:

  • 2022-12-23
  • 2022-12-23
  • 2022-12-23
  • 2022-12-23
  • 2022-12-23
  • 2021-08-24
  • 2022-12-23
  • 2021-04-24
猜你喜欢
  • 2022-01-21
  • 2022-12-23
  • 2022-12-23
  • 2022-12-23
  • 2022-12-23
  • 2022-02-17
  • 2022-12-23
相关资源
相似解决方案