функция jQuery keyup проверяет номер

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

        $('#p_first').keyup(function(event){
        if(isNaN(String.fromCharCode(event.which))){
            var value = $(this).val();

            $(this).val(value.substr(0,value.length-1));
        }
    });

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

8 ответов


попробуйте привязать к keypress событие вместо keyup. Он срабатывает неоднократно, когда ключ удерживается. Когда клавиша нажата не номер, вы можете позвонить preventDefault() который будет держать ключ от быть помещен в тег input.

   $('#p_first').keypress(function(event){

       if(event.which != 8 && isNaN(String.fromCharCode(event.which))){
           event.preventDefault(); //stop character from entering input
       }

   });

Пример: http://jsfiddle.net/rTWrb/2/


Я решил использовать ответ, предоставленный @Rahul Yadav, но он ошибочен, поскольку он не учитывает клавиши Num pad, которые имеют разные коды.

здесь вы можете увидеть выдержка из таблицы кодов:

вот функция, которую я реализовал:

function isNumberKey(e) {
var result = false; 
try {
    var charCode = (e.which) ? e.which : e.keyCode;
    if ((charCode >= 48 && charCode <= 57) || (charCode >= 96 && charCode <= 105)) {
        result = true;
    }
}
catch(err) {
    //console.log(err);
}
return result;

}


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

этот код проверяет входное значение после нажатия пользователем клавиши:

$('#p_first').keyup(function(){
    while(! /^(([0-9]+)((\.|,)([0-9]{0,2}))?)?$/.test($('#p_first').val())){
        $('#p_first').val($('#p_first').val().slice(0, -1));
    }
});

в то время как цикл удаляет последний символ, пока входное значение не будет действительным. Regex /^(([0-9]+)((\.|,)([0-9]{0,2}))?)?$/ проверить целое число и число float, например. "12,12", "12.1", "12.". важно, чтобы число " 12."(точка в конце) также действительно! в противном случае пользователь не может ввести какой-либо период.

а затем на Отправить регулярное выражение проверить на действительный номер поплавка ([0-9]{1,2}) вместо ([0-9]{0,2}):

$('form').submit(function(e){
    if(! /^([0-9]+)((\.|,)([0-9]{1,2}))?$/.test($('#p_first').val())){
        $('#p_first').addClass('error');
        e.preventDefault();
    }
});

обратите внимание: лучше назначить $('#p_first') в переменную. var input = $('#p_first');



попробуйте это..это может быть полезно.

<HTML>
<input type="text" name="qty" id="price" value="" style="width:100px;" field="Quantity" class="required">
</HTML>

<script>
 $(document).ready(function() {
$('#price').live('keyup',function(){
        this.value = this.value.replace(/[^0-9\.]/g,'');
        });
});
</script>

я использовал следующую функцию, чтобы проверить, является ли данная строка номером или нет. Эта реализация работает на keyup и keydown, а также заботится о клавишах numpad

// Validate Numeric inputs
function isNumber(o) {
    return o == '' || !isNaN(o - 0);
}

предполагая, что ваш код ключа в событии keyup или keydown находится в переменной keyCode:

var keyCode = e.keyCode || e.which;
if (keyCode >= 96 && keyCode <= 105) {
        // Numpad keys
        keyCode -= 48;
}
console.log(isNumber(String.fromCharCode(keyCode)));
console.log(isNumber($(this).val() + String.fromCharCode(keyCode)));

Return false если возвращаемое значение из isNumber равно false:

    var txtVal = $(this).val() + String.fromCharCode(keyCode);
    if (!isNumber(txtVal)) {
        e.returnValue = false;
    }

С ключевым событием, используйте event.key чтобы получить фактическое значение. Чтобы проверить, является ли integer:

isFinite(event.key);

более простым решением HTML было бы использовать number тип входного сигнала. Он ограничивается только числами (вид).

<input type="number">

в любом случае, вы должны очистить весь пользовательский ввод с помощью:

string.replace(/[^0-9]/g,'');

JavaScript:

  function isNumberKey(a){
  var x=a.val();
  a.val(x.replace(/[^0-9\.]/g,''));

}

HTML:

     <td><input type="text" name="qty" onkeypress="onkeyup="return isNumberKey($(this));"" value="" style="width:100px;" field="Quantity" class="required"></td>