如何使输入字段仅接受数字

时间:2019-03-25 11:08:27

标签: javascript jquery regex

我有一个数字类型的输入字段,因此它只能接受数字 -我正在使用正则表达式来限制用户输入特殊字符 -它在系统上工作正常,但是在小型设备上(例如在我的手机中),键盘类型只是数字,但是当我单击时-它正在使用 我不要

我做了什么

$('#test').on('keypress', function(event) {

  var regex = new RegExp("^[0-9]+$");
  var key = String.fromCharCode(!event.charCode ? event.which : event.charCode);
  if (!regex.test(key)) {
    event.preventDefault();
    return false;
  }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/css/bootstrap.min.css">
<input type="number" class="form-control" id="test">

它在手机上这样显示

this

-我已经尝试过使用正则表达式来限制它,但不能在手机上使用

修改 我快要接近了,我正在尝试使用下面的代码,但是下次我没有按时,它是第一次花负-,就像如果我输入55然后我按-,这不是花时间,而是当我在输入任何数字之前按-

(function($) {
  $.fn.inputFilter = function(inputFilter) {
    return this.on("input keydown keyup mousedown mouseup select contextmenu drop", function() {
      if (inputFilter(this.value)) {
        this.oldValue = this.value;
        this.oldSelectionStart = this.selectionStart;
        this.oldSelectionEnd = this.selectionEnd;
      } else if (this.hasOwnProperty("oldValue")) {
        this.value = this.oldValue;
        this.setSelectionRange(this.oldSelectionStart, this.oldSelectionEnd);
      }
    });
  };
}(jQuery));




$("#uintTextBox").inputFilter(function(value) {


  return ^\d + [.] ? \d + $.test(value);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id="uintTextBox" type="tel">

2 个答案:

答案 0 :(得分:1)

使用此正则表达式不允许-开头的<input type="tel">字符:

/^\d*[.]?\d*$/

请参阅工作提琴:https://jsfiddle.net/uhkv65yj/

答案 1 :(得分:0)

 /* Function allows only numbers and decimal */
$(document).on('keypress','#test',function(eve) {
    if ((  eve.which != 45 ||eve.which != 46 || $(this).val().indexOf('.') != -1 ) 
         && ( eve.which <  48 || eve.which > 57 ) 
         || ( $(this).val().indexOf('.') == 0) 
       )
       {
            eve.preventDefault();
       }
 })