Текстовые поля фильтра Jquery (предотвращение вставки определенных символов пользователем)

Question

Я пытаюсь запретить пользователям вводить определенные символы в текстовые поля, и этот код у меня есть:

$().ready(function() {
  $(".textbox").keypress(function(event) {
     var keyVal = event.keyCode;

     if ((keyVal > 48 && keyVal < 57)) {  // Numbers
       return false;
     }
  });
});

Он вводит событие и условие, но символ все еще вставляется. Любые идеи о том, как я об этом?

Answer 1

Ваше назначение keyVal не учитывает все браузеры. Этот фрагмент кода работает в Firefox, IE7, Safari, Chrome и не позволяет вводить числа в поле, протестировано с обычным элементом ввода текста:

$().ready(function(){
  $(".textbox").keypress(function(event){
    var keyVal = (event.charCode ? event.charCode : ((event.keyCode) ? event.keyCode : event.which));
      if((keyVal > 48 && keyVal < 57))// Numbers
      {
         return false;
      }
    });
});

Answer 2

Вы должны включить keyVal = 48 и keyVal = 57, иначе вы разрешите 0 и 9 соответственно. Конечный код будет выглядеть так:

$().ready(function(){
    $(".textbox").keypress(function(event){
        var keyVal =  (event.charCode || event.keyCode || event.which);
        if((keyVal >= 48 && keyVal <= 57))// Numbers
        {
            return false;
        }
    });
});

Также выглядит яснее при использовании || оператор, как предложил Девон.

Answer 3

Когда мне приходилось делать подобные вещи, я использовал событие onkeyup.

Вместо автоматического удаления символов (что может привести к путанице у пользователя), почему бы не иметь регулярное выражение, проверяющее действительные символы при вводе ключа, а затем, возможно, отображающее примечание к входу, что-то вроде «Вы не можете вводить числа в этом поле» или что-то более конкретное для фактического поля ввода: «Название вашего города может не включать число (я)».