Плагин jquery для предотвращения ввода любого ввода, не соответствующего регулярному выражению - PullRequest
6 голосов
/ 08 января 2009

имеет ли jquery какой-либо плагин, который не позволяет вводить какие-либо данные в текстовое поле, которое не соответствует шаблону регулярных выражений. например, у меня есть текстовое поле для ввода суммы платежа, я хочу, чтобы пользователь мог вводить только цифры и. в текстовом поле все остальные входные данные не будут иметь никакого влияния на текстовое поле ..

спасибо

Ответы [ 5 ]

6 голосов
/ 08 января 2009

Плагин для маскирования

jQuery(function($){   
    $("#paymentAmount").mask("9999.99");
});
5 голосов
/ 17 июля 2009

Плагин jquery-keyfilter - делает то, что нужно.

1 голос
/ 09 января 2009

Не думаю, что такой плагин доступен. Проблема немного сложна, потому что вы должны позволить пользователю вводить некоторые данные перед применением вашего регулярного выражения. То есть, вы не можете просто сопоставить каждый символ в том виде, в котором он напечатан, если ваше регулярное выражение просто не определяет набор символов.

Чтобы проиллюстрировать, что если они вводят сумму платежа и вы хотите разрешить ввод цифр и десятичных знаков только из одного символа, что мешает им ввести 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;
       }
    });

И, конечно, это не сработает, если они вставляются в определенные значения без выполнения "реальной" типизации.

Может быть, какой-то другой подход подойдет вам лучше? Как выделение поля и указание пользователю, если они вводят нецифровое, не десятичное или если они вводят более одного десятичного знака, вместо фильтрации самого ввода, потому что это выглядит грязно.

1 голос
/ 09 января 2009

События клавиатуры немного сложнее, как это предлагается в документации по 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();
    }
}

Это также отключит другие важные клавиши, такие как ввод, вкладка, удаление, поэтому их необходимо добавить в условные выражения. Не все остальные ключи пригодны для печати и поэтому не могут быть переопределены, поэтому вам придется проверить их 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();
});
0 голосов
/ 16 февраля 2012

Вот простое расширение 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();
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...