【问题标题】:jquery keyup function check if numberjquery keyup函数检查是否为数字
【发布时间】:2013-06-17 01:07:06
【问题描述】:

我正在尝试创建一个用户只能输入数字的输入字段。这个功能对我来说已经几乎可以正常工作了:

        $('#p_first').keyup(function(event){
        if(isNaN(String.fromCharCode(event.which))){
            var value = $(this).val();

            $(this).val(value.substr(0,value.length-1));
        }
    });

但问题是,当用户持有带有字符的键时,keyup 功能不会触发....有什么想法可以禁止这个吗?

【问题讨论】:

  • 持有哪个键?给出问题原因的更多描述?
  • any key... input type=text... 并且用户正在持有例如“aaaaaaaaaaaaaaaa”,因此函数 keyup() 不会触发,直到他停止按住键“a”跨度>
  • 感谢您提供更多问题,我认为我提出的解决方案应该可以解决您的问题。

标签: jquery function character keyup


【解决方案1】:

尝试绑定到keypress 事件而不是keyup。当一个键被按住时它会被反复触发。当按下的键不是数字时,您可以调用preventDefault(),这将防止键被放置在输入标签中。

   $('#p_first').keypress(function(event){

       if(event.which != 8 && isNaN(String.fromCharCode(event.which))){
           event.preventDefault(); //stop character from entering input
       }

   });

工作示例: http://jsfiddle.net/rTWrb/2/

【讨论】:

  • 我试过了,但是新的字符是在功能按键不在文本字段中运行的时候,所以我不能用 substr() 删除它
  • @AdamSam 很高兴我能帮上忙。
  • 一件事......现在无法删除数字:D
  • @AdamSam 你也应该忽略:箭头,删除键,当用鼠标和块空间按钮选择文本时
  • @KevinBowersox 我有类似的要求..但在我的情况下,用户也可以输入负数..所以如何允许用户仅在第一个位置输入“-”号号码
【解决方案2】:

试试这个解决方案:

jQuery('.numbersOnly').keyup(function () { 
    this.value = this.value.replace(/[^0-9\.]/g,'');
});

演示:http://jsfiddle.net/DbRTj/

同样的问题:

【讨论】:

  • @IagoMelanias 你是什么意思?您是在谈论第二个输入还是关于主题起始代码?
  • 我说的是你的代码。如果我使用键盘右侧的键,它不起作用。
  • @IagoMelanias Press NumLock 这应该可以解决您的问题。
【解决方案3】:
JavaScript:

  function isNumberKey(a){
  var x=a.val();
  a.val(x.replace(/[^0-9\.]/g,''));

}

HTML:

     <td><input type="text" name="qty" onkeypress="onkeyup="return isNumberKey($(this));"" value="" style="width:100px;" field="Quantity" class="required"></td>

【讨论】:

  • 转义返回 true?
  • 该功能是错误的,因为它不考虑具有不同代码的数字键盘键。请参阅替代答案。
  • 如果输入只有数字,这个函数返回真。
  • 不处理小键盘键
【解决方案4】:

试试这个..它可能有用。

<HTML>
<input type="text" name="qty" id="price" value="" style="width:100px;" field="Quantity" class="required">
</HTML>

<script>
 $(document).ready(function() {
$('#price').live('keyup',function(){
        this.value = this.value.replace(/[^0-9\.]/g,'');
        });
});
</script>

【讨论】:

    【解决方案5】:

    我决定使用@Rahul Yadav 提供的答案,但这是错误的,因为它没有考虑具有不同代码的数字键盘键。

    在这里,你可以看到excerpt of the code table

    这里是我实现的功能:

    function isNumberKey(e) {
        var result = false; 
        try {
            var charCode = (e.which) ? e.which : e.keyCode;
            if ((charCode >= 48 && charCode <= 57) || (charCode >= 96 && charCode <= 105)) {
                result = true;
            }
        }
        catch(err) {
            //console.log(err);
        }
        return result;
    }
    

    【讨论】:

      【解决方案6】:

      最好的方法是检查输入的值,而不是按键。因为有制表符、箭头、退格等字符在使用字符码时需要勾选。

      用户按键后代码检查输入值:

      $('#p_first').keyup(function(){
          while(! /^(([0-9]+)((\.|,)([0-9]{0,2}))?)?$/.test($('#p_first').val())){
              $('#p_first').val($('#p_first').val().slice(0, -1));
          }
      });
      

      While 循环删除最后一个字符,直到输入值有效。正则表达式/^(([0-9]+)((\.|,)([0-9]{0,2}))?)?$/ 验证整数和浮点数,例如。 “12,12”、“12.1”、“12.”。 数字“12”很重要。 (末尾的点)也有效!否则用户无法输入任何句点。

      然后在提交正则表达式时检查有效浮点数([0-9]{1,2}) 而不是([0-9]{0,2})

      $('form').submit(function(e){
          if(! /^([0-9]+)((\.|,)([0-9]{1,2}))?$/.test($('#p_first').val())){
              $('#p_first').addClass('error');
              e.preventDefault();
          }
      });
      

      注意:最好将$('#p_first')赋值给变量。 var input = $('#p_first');

      【讨论】:

        【解决方案7】:

        我使用以下函数来检查给定字符串是否为数字。此实现适用于 keyup 和 keydown 并且还处理数字键盘键

        // Validate Numeric inputs
        function isNumber(o) {
            return o == '' || !isNaN(o - 0);
        }
        

        假设您在 keyup 或 keydown 事件上的键码在 keyCode 变量中:

        var keyCode = e.keyCode || e.which;
        if (keyCode >= 96 && keyCode <= 105) {
                // Numpad keys
                keyCode -= 48;
        }
        console.log(isNumber(String.fromCharCode(keyCode)));
        console.log(isNumber($(this).val() + String.fromCharCode(keyCode)));
        

        如果 isNumber 的返回值为 false,则返回 false:

            var txtVal = $(this).val() + String.fromCharCode(keyCode);
            if (!isNumber(txtVal)) {
                e.returnValue = false;
            }
        

        【讨论】:

          【解决方案8】:

          对于按键事件,使用event.key 获取实际值。检查是否为整数:

          isFinite(event.key);
          

          更简单的 HTML 解决方案是使用 number 类型输入。它仅限于数字(种类)。

          <input type="number">
          

          无论哪种方式,您都应该清除所有用户输入:

          string.replace(/[^0-9]/g,'');
          

          【讨论】:

            猜你喜欢
            • 1970-01-01
            • 2013-01-06
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            相关资源
            最近更新 更多