输入框只允许输入数字案例

作者: 王远清orz | 来源:发表于2019-11-16 15:17 被阅读0次

<body>
  <input type="text" name="" id="ipt" style="ime-mode: disabled;">
  <script>
    var ipt = document.getElementById('ipt');
    //此方法有缺陷，当输入法为中文时，keyCode返回229，未知。按enter可以输入到输入框内。
    ipt.onkeydown = function (e) {
      // 键盘码   e.keyCode
      console.log(e.keyCode);
      e = e || window.event;
      if((e.keyCode<48 || e.keyCode>57) && e.keyCode !=8){
        preventDefault(e);
      }
    }
    
    //正则替换， 此方法也有缺陷，中文输入法时快速按键盘会出现吧之前输入的数字删除的情况
    // ipt.oninput = function () { 
    //   this.value=this.value.replace(/\D|^0/g,'');
    // } 

    // type = "number"   输入框后面会出现加减按钮，可以用白色遮层遮住
  </script>
</body>