Проверка числового ввода

Question

Я делаю проверку на элемент ввода = 'текст'. Я подключил события «paste» и «keydown», чтобы захватить входные данные и ограничить их просто цифрами. Keydown, похоже, работает без сучка и задоринки, однако я не мог заставить ни один из браузеров фактически НЕ Вставить текст в поле (я вижу, что есть событие beforepaste, которое может быть билетом - однако оно появляется чтобы не поддерживать Firefox. В конце концов, я привел к простому закрытию ввода, если значение не было числом. Это вызывает мгновенное мерцание, но, похоже, работает.

Есть ли более чистый способ сделать это ? Я там что-то отсутствует? это все равно, чтобы предотвратить мерцание? Я знаю, что HTML5 имеет тип = «число», но я не готов пойти туда еще.

<input type="text" id="number" /> 

<script type="text/javascript"> 
    $(document).ready(function() { 

     enableNumericOnlyEntry("#number"); 

     function enableNumericOnlyEntry(object) { 
      $(object).bind('paste', numericOnlyPaste); 
      $(object).bind('keydown', null, numericOnlyKeyDown); 

      function numericOnlyPaste(event) { 
       var inputText = ""; 
       var element = event.target; 
       setTimeout(function() { 
        var text = $(element).val(); 
        if (isNaN(text)) { 
         $(element).val("") 
         return false; 
        } 
       }, 0); 
      } 

      function numericOnlyKeyDown(event) { 
       // Allow: backspace, delete, tab, escape, and enter 
       if (event.keyCode == 46 || event.keyCode == 8 || event.keyCode == 9 || event.keyCode == 27 || event.keyCode == 13 || 
        // Allow: Ctrl+A/a 
        (event.keyCode == 65 || event.keyCode == 97) && (event.ctrlKey === true) || 
        // Allow: Ctrl+C/c 
        (event.keyCode == 67 || event.keyCode == 99) && (event.ctrlKey === true) || 
        // Allow: Ctrl+V/v 
        (event.keyCode == 86 || event.keyCode == 118) && (event.ctrlKey === true) || 
        // Allow: Ctrl+X/x 
        (event.keyCode == 88 || event.keyCode == 120) && (event.ctrlKey === true) || 
        // Allow: home, end, left, right 
        (event.keyCode >= 35 && event.keyCode <= 39)) { 
        // let it happen, don't do anything 
        return true; 
       } 
       else { 
        // Ensure that it is a number and stop the keypress 
        if (event.shiftKey || (event.keyCode < 48 || event.keyCode > 57) && (event.keyCode < 96 || event.keyCode > 105)) { 
         return false; 
        } 
       } 
      } 
     } 
    }); 

Answer 1

Я использовал этот проект для создания поля, которое является скрытым полем редактирования, вы можете удалить un derscore к этому также так, чтобы он не выглядел как маскированное редактирование. Действительно прост в использовании: http://digitalbush.com/projects/masked-input-plugin/

тогда вы бы использовали что-то вроде $ ("# box"). Mask ("9999999"); и твоя доброта, отлично работает!

Answer 2

HTML5's <input type="number"> действительно, где вы хотите пойти с этим. Если вы работаете с браузерами, которые его поддерживают (в основном, все, кроме Safari и старых версий IE), он делает все, что вам нужно.

Сказали, почему бы не зарегистрировать обработчик onpaste, чтобы вы могли уменьшить вставленный контент до нужных чисел после того, как пользовательские пасты?