2015-10-21 5 views
2

У меня возникла странная проблема с моей директивой по Firefox. Моя директива просто ограничивает ввод пользователя, и он работает на Chrome, как и должно быть. Но в Firefox, когда пользователь вводит вход, и он достигает своего предела, вы больше не можете удалять номер .. блокировка backspace как-то или любые клавиши не работают. Например: , когда пользователь пытается ввести более 999 клавиатурных замков, но вы все равно можете удалить номер на хроме. Но в Firefox вы не можете удалить или нажать любое число. Любые идеи?Угловая директива по Firefox

.directive("limitTo", [function() { 
    return { 
     restrict: "A", 
     link: function(scope, elem, attrs) { 
      var limit = parseInt(attrs.limitTo); 
      angular.element(elem).on("keypress", function() { 
       if (this.value.length == limit){ 
        return false; 
       } 
      }); 
     } 
    }; 
}]); 

Элемент:

input limit-to="3" type="number" name="performance" class="typo-xl-l input-power"> 
+0

Вы думали об использовании 'input' событие вместо этого? Например, можно вставить данные с помощью мыши. – raina77ow

ответ

2

Я считаю, что вы должны использовать event.preventDefault() вместо того, чтобы просто возвращение ложным в обработчике событий .. и вы можете проверить наличие определенных ключевых кодов (например, , backspace - 8);

.directive("limitTo", [function() { 
    return { 
     restrict: "A", 
     link: function(scope, elem, attrs) { 
      var limit = parseInt(attrs.limitTo); 

      //backspace, up arrow, down arrow, delete... gets complicated quickly. 
      // you'll probably want more than these 
      var allowedKeys = [8, 38, 40, 46]; 

      angular.element(elem).on("keypress", function(event) { 
       var key = event.which || event.keyCode; 
       if (this.value.length === limit && allowedKeys.indexOf(key) < 0){ 
        event.preventDefault(); 
       } 
      }); 
     } 
    }; 
    }]); 

скрипку @http://jsfiddle.net/o6gcyLjk/18/

Вы можете дополнительно использовать минимальные и максимальное свойства на входном контроле, чтобы ограничить диапазон номеров ... но пользователь все еще может скопировать & пасты, чтобы получить вход в что вы не хотите.

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

+0

«предотвращение удаления пользователем символов после того, как есть 3», это моя проблема. В chrome это не проблема, но в firefox user can not delete, когда он вводит 3 charachters. –

+0

Если вы попробуете Chrome, удаление после того, как 3 символа работают со своей скрипкой, но если вы попытаетесь использовать firefox, вы не можете удалить .. попробуйте свою скрипку на обоих браузерах PLS .. –

Смежные вопросы