7

jquery 是否有任何插件可以防止将任何输入输入到与正则表达式模式不匹配的文本框中。例如，我有一个用于输入付款金额的文本框，我希望用户只能输入数字和。在文本框中，所有其他输入不会对文本框产生任何影响..

谢谢

4

5 回答 5

6

屏蔽输入插件

jQuery(function($){   
    $("#paymentAmount").mask("9999.99");
});
于 2009-01-08T19:19:34.920 回答
5

jquery-keyfilter 插件- 做需要的事情。

于 2009-07-17T00:26:15.107 回答
2

我不认为有任何这样的插件现成可用。这个问题有点棘手，因为您必须允许用户在应用您的正则表达式之前输入一些输入。也就是说，您不能只匹配输入的每个字符，除非您的正则表达式仅定义一组字符。

举例来说，如果他们正在输入付款金额，并且您希望在单个字符的基础上允许数字和小数，那么是什么阻止了他们输入99.99.23.42492？

另一方面，如果你提供一个完整的正则表达式/\d+\.\d{2}/，那么它在单个字符上根本不匹配，你必须允许他们在尝试应用正则表达式之前输入一些字符并清除他们的输入如果不匹配。这可能令人沮丧。

如果您真的想在输入时过滤输入，那么您希望允许第一个字符使用数字，然后允许后续字符使用数字或小数，直到输入小数，然后再输入两个数字，然后不再输入。它不是通用过滤器。

例如，这里有一些代码可以做到这一点，但它非常难看。

   myInput.keydown(function() {
       var text = this.val
       if(!/^\d/.test(text)) {
          return '';
       } else {
          done = text.match(/^(\d+\.\d\d)/);
          if (done) { return done[0]; }

          last_char = text.substr(text.length-1,1);
          decimal_count = text.replace(/[^\.]/g,'').length;

          if (decimal_count < 1) {
             if (!/[\d\.]/.test(last_char)) {
                return text.substr(0,text.length-1);
             }
          } else if (decimal_count == 1 && last_char == '.') {
             return text;
          } else {
             if (!/[\d]/.test(last_char)) {
                return text.substr(0,text.length-1);
             }
          }
          return text;
       }
    });

当然，如果他们碰巧粘贴了某些值而没有进行“真正的”输入，这将不起作用。

也许其他一些方法对你更有效？就像突出显示该字段并向用户指示他们是否输入了非数字、非小数或是否输入了多个小数，而不是过滤输入本身，因为这看起来很混乱。

于 2009-01-08T21:59:48.183 回答
1

正如 jQuery 文档中所建议的那样，键盘事件有点棘手。
http://unixpapa.com/js/key.html
http://yehudakatz.com/2007/07/03/event-normalization-in-jquery-113/

与您有关的困难是：

识别键
当您捕捉到一个键盘事件时，您可能希望知道按下了哪个键。如果是这样，你可能要求太多了。这是浏览器不兼容和错误的一大堆。
从上面的第一个链接

同样，在 jQuery 中我会这样做：

textBoxElement.keydown( function( e ) {
    var chr = String.fromCharCode( e.which );
    if( !/[0-9.]/.test( chr ) ) {
        e.preventDefault();
    }
}

这也将禁用其他重要的键，如 enter、tab、delete，因此需要将它们添加到条件中。并非所有其他键都是可打印的，因此不能进行正则表达式，因此您必须检查它们的 e.keyCode。13、8等

如果你对正则表达式不太在意，你可以做类似的事情

textBoxElement.keydown( function( e ) {
    switch( e.keyCode ) {
        case 48: //0
        case 49: //1
        case 50: //2
        case 51: //3
        case 52: //4
        case 53: //5
        case 54: //6
        case 55: //7
        case 56: //8
        case 57: //9
        case 48: //10
        case 37: //left
        case 39: //right
        case 8:  //tab
        case 13: //return
        case 46: //del
        case 190: //.
            return;
    }
    e.preventDefault();
});
于 2009-01-08T21:30:03.347 回答
0

这是我使用的一个简单的 jquery 扩展：

jQuery.fn.DecimalMask = function () {
  return this.each(function () {
    $(this).keypress(function (e) {
      var keynum;
      if (window.event) // IE
      {
        keynum = e.keyCode;
      }
      else if (e.which) // Netscape/Firefox/Opera
      {
        keynum = e.which;
      }
      if (typeof keynum == 'undefined') return true;
      else if (keynum == 46 && $(this).val().indexOf(".") > -1) return false; //already has a decimal point
      else return ((keynum > 47 && keynum < 58) || keynum == 13 || keynum == 8 || keynum == 9 || keynum == 46 || keynum == 45); //allow ony number keys or keypad number keys
    });
  });
};
//implementation
$("#mytxtbox").DecimalMask();
于 2012-02-16T19:18:06.340 回答