Вот функция, которую я использую:

// Numeric only control handler
jQuery.fn.ForceNumericOnly =
function()
{
    return this.each(function()
    {
        $(this).keydown(function(e)
        {
            var key = e.charCode || e.keyCode || 0;
            // allow backspace, tab, delete, enter, arrows, numbers and keypad numbers ONLY
            // home, end, period, and numpad decimal
            return (
                key == 8 || 
                key == 9 ||
                key == 13 ||
                key == 46 ||
                key == 110 ||
                key == 190 ||
                (key >= 35 && key <= 40) ||
                (key >= 48 && key <= 57) ||
                (key >= 96 && key <= 105));
        });
    });
};

Затем вы можете прикрепить его к своему управлению, выполнив:

$("#yourTextBoxName").ForceNumericOnly();

Инлайн:

<input name="number" onkeyup="if (/\D/g.test(this.value)) this.value = this.value.replace(/\D/g,'')">

Ненавязчивый стиль (с jQuery):

$('input[name="number"]').keyup(function(e)
                                {
  if (/\D/g.test(this.value))
  {
    // Filter non-digits from input value.
    this.value = this.value.replace(/\D/g, '');
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input name="number">

Вы можете просто использовать простое регулярное выражение JavaScript для проверки чисто числовых символов:

/^[0-9]+$/.test(input);

Возвращает true, если ввод является числовым или ложным, если нет.

или для ключевого кода события, простое использование ниже:

     // Allow: backspace, delete, tab, escape, enter, ctrl+A and .
    if ($.inArray(e.keyCode, [46, 8, 9, 27, 13, 110, 190]) !== -1 ||
         // Allow: Ctrl+A
        (e.keyCode == 65 && e.ctrlKey === true) || 
         // Allow: home, end, left, right
        (e.keyCode >= 35 && e.keyCode <= 39)) {
             // let it happen, don't do anything
             return;
    }

    var charValue = String.fromCharCode(e.keyCode)
        , valid = /^[0-9]+$/.test(charValue);

    if (!valid) {
        e.preventDefault();
    }

Вы можете использовать это событие ввода следующим образом:

$(document).on("input", ".numeric", function() {
    this.value = this.value.replace(/\D/g,'');
});

Но что это за привилегия этого кода?

• Он работает на мобильных браузерах (проблемы с keydown и keyCode имеют проблемы).
• Он также работает с созданным контентом AJAX, потому что мы используем "on".
• Лучшая производительность, чем keydown, например, при вставке.

Короткий и сладкий - даже если это никогда не найдет много внимания после 30+ ответов;)

  $('#number_only').bind('keyup paste', function(){
        this.value = this.value.replace(/[^0-9]/g, '');
  });

Использовать функцию JavaScript isNaN,

if (isNaN($('#inputid').val()))

if (isNaN (document.getElementById('inputid'). val()))

if (isNaN(document.getElementById('inputid').value))

Update: И здесь хорошая статья, рассказывающая об этом, но использующая jQuery: Ограничение ввода текстовых полей HTML на числовые значения

Более простой для меня -

jQuery('.plan_eff').keyup(function () {     
  this.value = this.value.replace(/[^1-9\.]/g,'');
});

$(document).ready(function() {
    $("#txtboxToFilter").keydown(function(event) {
        // Allow only backspace and delete
        if ( event.keyCode == 46 || event.keyCode == 8 ) {
            // let it happen, don't do anything
        }
        else {
            // Ensure that it is a number and stop the keypress
            if (event.keyCode < 48 || event.keyCode > 57 ) {
                event.preventDefault(); 
            }   
        }
    });
});

Источник: http://snipt.net/GerryEng/jquery-making-textfield-only-accept-numeric-values

Я использую это в нашем внутреннем общем файле js. Я просто добавляю класс к любому входу, которому это нужно.

$(".numericOnly").keypress(function (e) {
    if (String.fromCharCode(e.keyCode).match(/[^0-9]/g)) return false;
});

Почему так сложно? Вам даже не нужен jQuery, потому что есть атрибут шаблона HTML5:

<input type="text" pattern="[0-9]*">

Самое интересное, что он вызывает цифровую клавиатуру на мобильных устройствах, что намного лучше, чем использование jQuery.

Вы можете сделать то же самое, используя это очень простое решение

$("input.numbers").keypress(function(event) {
  return /\d/.test(String.fromCharCode(event.keyCode));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" class="numbers" name="field_name" />

Я ссылался на эту ссылку для решения. Он отлично работает!!!

Атрибут pattern в HTML5 указывает регулярное выражение, которое проверяется на значение элемента.

  <input  type="text" pattern="[0-9]{1,3}" value="" />

Примечание. Атрибут pattern работает со следующими типами ввода: текстом, поиском, URL-адресом, телефоном, электронной почтой и паролем.

• [0-9] можно заменить любым условием регулярного выражения.

• {1,3} он представляет собой минимум 1 и может быть введен максимум 3 цифры.

Вы можете попробовать HTML5 number:

<input type="number" value="0" min="0"> 

Для несовместимых браузеров есть Modernizr и Webforms2 fallbacks.

Что-то довольно простое, используя jQuery.validate

$(document).ready(function() {
    $("#formID").validate({
        rules: {
            field_name: {
                numericOnly:true
            }
        }
    });
});

$.validator.addMethod('numericOnly', function (value) {
       return /^[0-9]+$/.test(value);
}, 'Please only enter numeric values (0-9)');

Я пришел к очень хорошему и простому решению, которое не мешает пользователю выбирать текст или скопировать вставку, как это делают другие решения. Стиль jQuery:)

$("input.inputPhone").keyup(function() {
    var jThis=$(this);
    var notNumber=new RegExp("[^0-9]","g");
    var val=jThis.val();

    //Math before replacing to prevent losing keyboard selection 
    if(val.match(notNumber))
    { jThis.val(val.replace(notNumber,"")); }
}).keyup(); //Trigger on page load to sanitize values set by server

Функция suppressNonNumericInput (событие) {

    if( !(event.keyCode == 8                                // backspace
        || event.keyCode == 46                              // delete
        || (event.keyCode >= 35 && event.keyCode <= 40)     // arrow keys/home/end
        || (event.keyCode >= 48 && event.keyCode <= 57)     // numbers on keyboard
        || (event.keyCode >= 96 && event.keyCode <= 105))   // number on keypad
        ) {
            event.preventDefault();     // Prevent character input
    }
}

Вы можете использовать эту функцию JavaScript:

function maskInput(e) {
    //check if we have "e" or "window.event" and use them as "event"
        //Firefox doesn't have window.event 
    var event = e || window.event 

    var key_code = event.keyCode;
    var oElement = e ? e.target : window.event.srcElement;
    if (!event.shiftKey && !event.ctrlKey && !event.altKey) {
        if ((key_code > 47 && key_code < 58) ||
            (key_code > 95 && key_code < 106)) {

            if (key_code > 95)
                 key_code -= (95-47);
            oElement.value = oElement.value;
        } else if(key_code == 8) {
            oElement.value = oElement.value;
        } else if(key_code != 9) {
            event.returnValue = false;
        }
    }
}

И вы можете связать его с текстовым полем следующим образом:

$(document).ready(function() {
    $('#myTextbox').keydown(maskInput);
});

Я использую вышеприведенное в производстве, и он отлично работает, и это кросс-браузер. Кроме того, это не зависит от jQuery, поэтому вы можете привязать его к текстовому поле со встроенным JavaScript:

<input type="text" name="aNumberField" onkeydown="javascript:maskInput()"/>

Я думаю, что это поможет всем

  $('input.valid-number').bind('keypress', function(e) { 
return ( e.which!=8 && e.which!=0 && (e.which<48 || e.which>57)) ? false : true ;
  })

Это кажется нерушимым.

// Prevent NULL input and replace text.
$(document).on('change', 'input[type="number"]', function (event) {
    this.value = this.value.replace(/[^0-9\.]+/g, '');
    if (this.value < 1) this.value = 0;
});

// Block non-numeric chars.
$(document).on('keypress', 'input[type="number"]', function (event) {
    return (((event.which > 47) && (event.which < 58)) || (event.which == 13));
});

Вот ответ, который использует jQuery UI Widget factory. Вы можете настроить, какие символы разрешены легко.

$('input').numberOnly({
    valid: "0123456789+-.$,"
});

Это позволит указывать числа, знаки количества и суммы в долларах.

$.widget('themex.numberOnly', {
    options: {
        valid : "0123456789",
        allow : [46,8,9,27,13,35,39],
        ctrl : [65],
        alt : [],
        extra : []
    },
    _create: function() {
        var self = this;

        self.element.keypress(function(event){
            if(self._codeInArray(event,self.options.allow) || self._codeInArray(event,self.options.extra))
            {
                return;
            }
            if(event.ctrlKey && self._codeInArray(event,self.options.ctrl))
            {
                return;
            }
            if(event.altKey && self._codeInArray(event,self.options.alt))
            {
                return;
            }
            if(!event.shiftKey && !event.altKey && !event.ctrlKey)
            {
                if(self.options.valid.indexOf(String.fromCharCode(event.keyCode)) != -1)
                {
                    return;
                }
            }
            event.preventDefault(); 
        });
    },

    _codeInArray : function(event,codes) {
        for(code in codes)
        {
            if(event.keyCode == codes[code])
            {
                return true;
            }
        }
        return false;
    }
});

Вот быстрое решение, которое я создал некоторое время назад. вы можете больше узнать об этом в моей статье:

http://ajax911.com/numbers-numeric-field-jquery/

$("#textfield").bind("keyup paste", function(){
    setTimeout(jQuery.proxy(function() {
        this.val(this.val().replace(/[^0-9]/g, ''));
    }, $(this)), 0);
});

Я написал мой, основанный на сообщении @user261922 выше, слегка измененный, чтобы вы могли выбрать все, вкладку и обрабатывать несколько полей "только число" на одной странице.

var prevKey = -1, prevControl = '';
$(document).ready(function () {
    $(".OnlyNumbers").keydown(function (event) {
        if (!(event.keyCode == 8                                // backspace
            || event.keyCode == 9                               // tab
            || event.keyCode == 17                              // ctrl
            || event.keyCode == 46                              // delete
            || (event.keyCode >= 35 && event.keyCode <= 40)     // arrow keys/home/end
            || (event.keyCode >= 48 && event.keyCode <= 57)     // numbers on keyboard
            || (event.keyCode >= 96 && event.keyCode <= 105)    // number on keypad
            || (event.keyCode == 65 && prevKey == 17 && prevControl == event.currentTarget.id))          // ctrl + a, on same control
        ) {
            event.preventDefault();     // Prevent character input
        }
        else {
            prevKey = event.keyCode;
            prevControl = event.currentTarget.id;
        }
    });
});

Вы можете попробовать ввести номер HTML5:

<input type="number" placeholder="enter the number" min="0" max="9">

Этот элемент тега ввода теперь будет принимать значение только от 0 до 9 поскольку атрибут min установлен в 0, а атрибут max - 9.

для получения дополнительной информации о посещении http://www.w3schools.com/html/html_form_input_types.asp

Просто нужно применить этот метод в JQuery, и вы можете проверить свое текстовое поле, чтобы просто принять номер.

function IsNumberKeyWithoutDecimal(element) {    
var value = $(element).val();
var regExp = "^\\d+$";
return value.match(regExp); 
}

Попробуйте это решение здесь

Простой способ проверить, что вводимое значение является числовым:

var checknumber = $('#textbox_id').val();

    if(jQuery.isNumeric(checknumber) == false){
        alert('Please enter numeric value');
        $('#special_price').focus();
        return;
    }

Я также хотел бы ответить:)

    $('.justNum').keydown(function(event){
        var kc, num, rt = false;
        kc = event.keyCode;
        if(kc == 8 || ((kc > 47 && kc < 58) || (kc > 95 && kc < 106))) rt = true;
        return rt;
    })
    .bind('blur', function(){
        num = parseInt($(this).val());
        num = isNaN(num) ? '' : num;
        if(num && num < 0) num = num*-1;
        $(this).val(num);
    });

Что это... просто цифры.:) Почти он может работать только с "размытием", но...

Вы хотите разрешить вкладку:

$("#txtboxToFilter").keydown(function(event) {
    // Allow only backspace and delete
    if ( event.keyCode == 46 || event.keyCode == 8 || event.keyCode == 9 ) {
        // let it happen, don't do anything
    }
    else {
        // Ensure that it is a number and stop the keypress
        if ((event.keyCode < 48 || event.keyCode > 57) && (event.keyCode < 96 || event.keyCode > 105 )) {
            event.preventDefault(); 
        }   
    }
});

Я хотел немного помочь, и я сделал свою версию, функцию onlyNumbers...

function onlyNumbers(e){
    var keynum;
    var keychar;

    if(window.event){  //IE
        keynum = e.keyCode;
    }
    if(e.which){ //Netscape/Firefox/Opera
        keynum = e.which;
    }
    if((keynum == 8 || keynum == 9 || keynum == 46 || (keynum >= 35 && keynum <= 40) ||
       (event.keyCode >= 96 && event.keyCode <= 105)))return true;

    if(keynum == 110 || keynum == 190){
        var checkdot=document.getElementById('price').value;
        var i=0;
        for(i=0;i<checkdot.length;i++){
            if(checkdot[i]=='.')return false;
        }
        if(checkdot.length==0)document.getElementById('price').value='0';
        return true;
    }
    keychar = String.fromCharCode(keynum);

    return !isNaN(keychar);
}

Просто добавьте тег ввода "... input... id =" price "onkeydown =" return onlyNumbers (event) "...", и вы закончили;)

Необходимо убедиться, что у вас есть цифровая клавиатура, и клавиша табуляции тоже работает.

 // Allow only backspace and delete
            if (event.keyCode == 46 || event.keyCode == 8  || event.keyCode == 9) {
                // let it happen, don't do anything
            }
            else {
                // Ensure that it is a number and stop the keypress
                if ((event.keyCode >= 48 && event.keyCode <= 57) || (event.keyCode >= 96 && event.keyCode <= 105)) {

                }
                else {
                    event.preventDefault();
                }
            }

Обновленное решение для лучшего пользовательского интерфейса, которое обращается к проблеме копирования + вставки и заменяет устаревший атрибут keyCode:

HTML

<input type="tel">

JQuery

$('[type=tel]').on('change', function(e) {
  $(e.target).val($(e.target).val().replace(/[^\d]/g, ''))
})
$('[type=tel]').on('keypress', function(e) {
  keys = ['0','1','2','3','4','5','6','7','8','9']
  return keys.indexOf(event.key) > -1
})

Детали:

Прежде всего, типы ввода:

number показывает стрелки вверх/вниз, уменьшающие фактическое пространство ввода, я нахожу их уродливыми и полезны только в том случае, если число представляет собой количество (такие вещи, как телефоны, коды областей, идентификаторы... им не нужны) tel обеспечивает аналогичные проверки браузером числа без стрелок

Использование [number/tel] также помогает показывать цифровую клавиатуру на мобильных устройствах.

Для проверки JS мне в итоге потребовались 2 функции, одна для обычного ввода пользователя (keypress), а другая для исправления (изменения) для копирования + вставки, другие комбинации давали бы мне ужасное чувство пользователя.

Я использую более надежный KeyboardEvent.key вместо устаревшего KeyboardEvent.charCode

И в зависимости от поддержки вашего браузера вы можете использовать Array.prototype.includes() вместо плохо названного Array.prototype.indexOf() (для получения истинных/ложных результатов)

Вот путь с регулярным выражением:

$('input').bind('keypress', function (event) {
var regex = new RegExp("^[0-9]+$");
var key = String.fromCharCode(!event.charCode ? event.which : event.charCode);
if (!regex.test(key)) {
   event.preventDefault();
   return false;
}

});

https://jsfiddle.net/astrapi69/qbk2vjty/1/

И вы можете изменить регулярное выражение на что-нибудь еще, если хотите ограничить другие символы, а затем цифры.

Если вам нужно решить диакритические знаки и специальные символы, попробуйте использовать это:

$(this).on( 'keypress', function( e )
{
    // Ensure that it is a number and stop the keypress
    if (e.shiftKey || (e.keyCode < 48 || e.keyCode > 57)) {
        e.preventDefault();
    }
});  

У меня возникла проблема с верхним ответом. Он не включает цифровую клавиатуру, и если один нажимает shift + number, специальные знаки также не должны отображаться. Но это решение не позаботится об этом.

Лучшая ссылка, которую я нашел в этой теме: http://www.west-wind.com/weblog/posts/2011/Apr/22/Restricting-Input-in-HTML-Textboxes-to-Numeric-Values

Я новичок в stackoverflow, поэтому не знаю, могу ли я просто отредактировать лучшее решение в топ-пост.

Чтобы подробнее рассказать о ответе № 3, я бы сделал следующее (ПРИМЕЧАНИЕ: по-прежнему не поддерживается вставкой с помощью клавиатуры или мыши):

$('#txtNumeric').keypress(
            function(event) {
                //Allow only backspace and delete
                if (event.keyCode != 46 && event.keyCode != 8) {
                    if (!parseInt(String.fromCharCode(event.which))) {
                        event.preventDefault();
                    }
                }
            }
        );

попробуйте его внутри html-кода, например, onkeypress и onpast

<input type="text" onkeypress="return event.charCode >= 48 && event.charCode <= 57" onpast="return false">

Вы можете использовать номер типа ввода HTML5, чтобы ограничить только числовые записи:

<input type="number" name="someid" />

Это будет работать только в браузере с жалобами HTML5. Убедитесь, что ваш документ html document:

<!DOCTYPE html>

Для общего назначения вы можете иметь JS-проверку, как показано ниже:

function isNumberKey(evt){
    var charCode = (evt.which) ? evt.which : event.keyCode
    if (charCode > 31 && (charCode < 48 || charCode > 57))
        return false;
    return true;
}

<input type="someid" name="number" onkeypress="return isNumberKey(event)"/>

Если вы хотите разрешить десятичные знаки, замените "if condition" следующим образом:

if (charCode > 31 && (charCode != 46 &&(charCode < 48 || charCode > 57)))

Источник: Текстовый ввод HTML допускает только числовой ввод

JSFiddle demo: http://jsfiddle.net/Gagan_Gami/nSjy7/333/

Это может быть излишним для того, что вы ищете, но я предлагаю плагин jQuery под названием autoNumeric() - это здорово!

Вы можете ограничить только цифры, десятичную точность, максимальные/минимальные значения и т.д.

http://www.decorplanit.com/plugin/

Вот почему я недавно написал для этого. Я знаю, что это уже ответили, но я оставляю это для последующего использования.

Этот метод разрешает только 0-9 как клавиатуру, так и numpad, обратные области, вкладку, стрелки влево и вправо (операции нормальной формы)

$(".numbersonly-format").keydown(function (event) {
    // Prevent shift key since its not needed
    if (event.shiftKey == true) {
        event.preventDefault();
    }
    // Allow Only: keyboard 0-9, numpad 0-9, backspace, tab, left arrow, right arrow, delete
    if ((event.keyCode >= 48 && event.keyCode <= 57) || (event.keyCode >= 96 && event.keyCode <= 105) || event.keyCode == 8 || event.keyCode == 9 || event.keyCode == 37 || event.keyCode == 39 || event.keyCode == 46) {
        // Allow normal operation
    } else {
        // Prevent the rest
        event.preventDefault();
    }
});

Этот код jQuery отфильтровывает символы, введенные в то время, когда Shift, Ctrl или Alt удерживаются.

$('#AmountText').keydown(function (e) {
    if (e.shiftKey || e.ctrlKey || e.altKey) { // if shift, ctrl or alt keys held down
        e.preventDefault();         // Prevent character input
    } else {
        var n = e.keyCode;
        if (!((n == 8)              // backspace
        || (n == 46)                // delete
        || (n >= 35 && n <= 40)     // arrow keys/home/end
        || (n >= 48 && n <= 57)     // numbers on keyboard
        || (n >= 96 && n <= 105))   // number on keypad
        ) {
            e.preventDefault();     // Prevent character input
        }
    }
});

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

  < input type =  "text"  pattern =  "[0-9.] +" />

$ ( "input [type = text] [pattern]" ). on ( "input", function() {   if (! this.checkValidity())       this.value = this.value.slice(0, -1);
});
Код>

Возможно, но не так просто для входов [type = number]...

Проблема с [type = "number" ] заключается в том, что мы можем не только удалить недопустимый символ в конце. Пользовательские агенты возвращают пустую строку всякий раз, когда ввод недействителен.

Из спецификации W3C HTML5:

Если значение элемента не является допустимым числом с плавающей запятой, то вместо этого установите его в пустую строку.

https://dev.w3.org/html5/spec-LC/number-state.html#number-state

Это означает, что нам нужен способ сохранить предыдущее значение ввода вручную.

Итак, для числовых входов решение будет выглядеть так:

  $( "input [type = number], input [type = text] [pattern]" ). on ( "input", function() {   if (! this.checkValidity())       this.value = $(this).data( "current-valid" ) || "";   еще       $ (this).data( "current-valid", this.value);
});
Код>

К сожалению, это не будет работать на IE и EDGE. Нам нужно прибегнуть к решению шаблона выше для этих браузеров. Тем не менее, вы все равно можете использовать цифровые входы с помощью этого простого polyfill.

  $( "input [type = number]" ). attr ( "type",  "text" ). attr ( "pattern",  "[0-9.] +" );
Код>

Многие люди используют keycode свойство , что не легко запомнить. Если у вас нет проблем с локалью, вы можете просто использовать ключ, который на самом деле вводит пользовательский тип.

Смотрите Fiddle

$("#txt").on("keypress",function(e){
  console.log("Entered Key is " + e.key);
  switch (e.key)
     {
         case "1":
         case "2":
         case "3":
         case "4":
         case "5":
         case "6":
         case "7":
         case "8":
         case "9":
         case "0":
         case "Backspace":
             return true;
             break;

         case ".":
             if ($(this).val().indexOf(".") == -1) //Checking if it already contains decimal. You can Remove this condition if you do not want to include decimals in your input box.
             {
                 return true;
             }
             else
             {
                 return false;
             }
             break;

         default:
             return false;
     }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

Enter Value
<input id="txt" type="text" />

то см. следующий простой код.

Обратите внимание, что этот пример также содержит проверку десятичной записи.

В соответствии с этим вопросом это не требуется, поэтому вы можете просто удалить случай "." для удаления записи десятичного числа.

добавить ниже код в document.ready

    $('.class of text box').keyup(function () 
    {
    this.value = this.value.replace(/[^0-9]/g, '');
    });  

Этот (числовой плагин jQuery) работает отлично и имеет некоторые опрятные функции, но вам, возможно, придется немного его настроить для ваших нужд и Поддержка IE.

/**
Makes the textbox to accept only numeric input
*/

(function($) {
    $.fn.allowOnlyNumeric = function() {

        /**
        The interval code is commented as every 250 ms onchange of the textbox gets fired.
        */

        //  var createDelegate = function(context, method) {
        //      return function() { method.apply(context, arguments); };
        //  };

        /**
        Checks whether the key is only numeric.
        */
        var isValid = function(key) {
            var validChars = "0123456789";
            var validChar = validChars.indexOf(key) != -1;
            return validChar;
        };

        /**
        Fires the key down event to prevent the control and alt keys
        */
        var keydown = function(evt) {
            if (evt.ctrlKey || evt.altKey) {
                evt.preventDefault();
            }
        };

        /**
        Fires the key press of the text box   
        */
        var keypress = function(evt) {
            var scanCode;
            //scanCode = evt.which;
            if (evt.charCode) { //For ff
                scanCode = evt.charCode;
            }
            else { //For ie
                scanCode = evt.keyCode;
            }

            if (scanCode && scanCode >= 0x20 /* space */) {
                var c = String.fromCharCode(scanCode);
                if (!isValid(c)) {
                    evt.preventDefault();
                }
            }
        };

        /**
        Fires the lost focus event of the textbox   
        */
        var onchange = function() {
            var result = [];
            var enteredText = $(this).val();
            for (var i = 0; i < enteredText.length; i++) {
                var ch = enteredText.substring(i, i + 1);
                if (isValid(ch)) {
                    result.push(ch);
                }
            }
            var resultString = result.join('');
            if (enteredText != resultString) {
                $(this).val(resultString);
            }

        };

        //var _filterInterval = 250;
        //var _intervalID = null;

        //var _intervalHandler = null;

        /**
        Dispose of the textbox to unbind the events.
        */
        this.dispose = function() {
            $(this).die('change', onchange);
            $(this).die('keypress', keypress);
            $(this).die('keydown', keydown);
            //window.clearInterval(_intervalHandler);
        };

        $(this).live('change', onchange);
        $(this).live('keypress', keypress);
        $(this).live('keydown', keydown);
        //_intervalHandler = createDelegate(this, onchange);
        //_intervalID = window.setInterval(_intervalHandler, _filterInterval);
    }
})(jQuery);

Вышеупомянутый $плагин написан из текстового поля фильтра AjaxControlToolkit extender.js.

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

этот был очень полезен http://jstepper.emkay.dk/Default.aspx другие принимают языки, отличные от английского

Вы также можете использовать этот плагин jQuery, jQuery alphaNumeric. Я нашел, что это действительно здорово.

Ни один из ответов не работал в моем случае, поэтому я немного изменил принятый ответ, чтобы он работал для динамически добавленных элементов.

Наслаждаться:

var inputFilter = function (elem, cb) {
    /*
    *    /^-?\d*$/               restricts input to integer numbers
    *    /^\d*$/                 restricts input to unsigned integer numbers
    *    /^[0-9a-f]*$/i          restricts input to hexadecimal numbers
    *    /^-?\d*[.,]?\d*$/       restricts input to floating point numbers (allowing both . and , as decimal separator)
    *    /^-?\d*[.,]?\d{0,2}$/   restricts input to currency values (i.e. at most two decimal places)
    */
    bdy.on('input keydown keyup mousedown mouseup select contextmenu drop', elem, function () {
        if (cb(this.value)) {
            this.oldValue = this.value;
            this.oldSelectionStart = this.selectionStart;
            this.oldSelectionEnd = this.selectionEnd;
        } else if (this.hasOwnProperty('oldValue')) {
            this.value = this.oldValue;
            this.setSelectionRange(this.oldSelectionStart, this.oldSelectionEnd);
        }
    });
};

Использование:

inputFilter('#onlyDigitsInput', function (val) {
    return /^\d*$/.test(val);
});

Есть так много хороших ответов на это с помощью java Script или jQuery здесь.

Я добавлю очень простой способ архивировать это, используя только HTML5.

<input type="number" name="quantity" min="0" max="9">

Это то, что я использую для проверки ввода числа для значений integer или float (ненавязчивый стиль с jQuery):

$('input[name="number"]').keyup(function(e) {
    var float = parseFloat($(this).attr('data-float'));

    /* 2 regexp for validating integer and float inputs *****
        > integer_regexp : allow numbers, but do not allow leading zeros
        > float_regexp : allow numbers + only one dot sign (and only in the middle of the string), but do not allow leading zeros in the integer part
    *************************************************************************/
    var integer_regexp = (/[^0-9]|^0+(?!$)/g);
    var float_regexp = (/[^0-9\.]|^\.+(?!$)|^0+(?=[0-9]+)|\.(?=\.|.+\.)/g);

    var regexp = (float % 1 === 0) ? integer_regexp : float_regexp;
    if (regexp.test(this.value)) {
        this.value = this.value.replace(regexp, '');
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" data-float="1" id="number" name="number" placeholder="integer">
<input type="text" data-float="0.1" id="number" name="number" placeholder="float">

Попробуйте этот

$('.plan_eff').keyup(function () {     
  this.value = this.value.replace(/[^1-9\.]/g,'');
});

введите класс в текст ввода и назовите его only_numbers

поместите код jquery на страницу

$(document).ready(function() {
    $('.only_numbers').keyup(function() {
        var numbers = $(this).val();
        $(this).val(numbers.replace(/\D/, ''));
    });
});

получайте удовольствие: -)

Я объединил все ответы в одном и придумал следующий код:

jQuery('#input_id', function(e){
    // Allow: backspace, delete, tab, escape, enter
    if (jQuery.inArray(e.keyCode, [46, 8, 9, 27, 13, 110]) !== -1 ||
        // Allow: Ctrl+A
        (e.keyCode === 65 && e.ctrlKey === true) ||
        // Allow: Ctrl+C
        (e.keyCode === 67 && e.ctrlKey === true) ||
        // Allow: Ctrl+X
        (e.keyCode === 88 && e.ctrlKey === true) ||
        // Disallow several dots (allow 190 only if no dots found)
        (e.keyCode === 190 && jQuery(this).val().indexOf('.') == -1) ||
        // Bug in some Android devices where it is always 229
        (e.keyCode === 229) ||
        // Allow: home, end, left, right
        (e.keyCode >= 35 && e.keyCode <= 40)) {
        // let it happen, don't do anything
        return;
    }
    // Ensure that it is a number and stop the keypress
    if ((e.shiftKey || (e.keyCode < 48 || e.keyCode > 57)) && (e.keyCode < 96 || e.keyCode > 105)) {
        e.preventDefault();
    }
});

Кроме того, форма должна иметь autocomplete="off". Без этой опции у вас могут возникнуть проблемы с автоматическими алгоритмами на мобильных устройствах.

Используйте простой простой jQuery, чтобы разрешать только числовые символы в tetbox. Вам не нужно фильтровать все специальные символы вручную, поэтому нет опасности пропустить какой-либо специальный char. Это позволит использовать только числа 0-9: (Поместите ниже код в документе и измените имя класса в соответствии с именем класса текстовых полей.)

//Event of data being keyed in to textbox with class="numericField".
$(".numericField").keyup(function() {
    // Get the non Numeric char that was enetered
    var nonNumericChars = $(this).val().replace(/[0-9]/g, '');                                  
    // Now set the value in text box 
    $(this).val( $(this).val().replace(nonNumericChars, ''));    

});

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

    allowBackspaceDeleteTabEscapeEnterPress: function(event){
    return ($.inArray(event.keyCode, [46, 8, 9, 27, 13, 190]) >= 0);
},
allowContorlAPress: function(event){
    return (event.keyCode == 65 && event.ctrlKey === true)
},
allowHomeEndLeftRightPress: function(event){
    return (event.keyCode >= 35 && event.keyCode <= 39)
},
theKeyPressedIsEditRelated: function (event) {
    return (this.allowBackspaceDeleteTabEscapeEnterPress(event)
            || this.allowContorlAPress(event)
            || this.allowHomeEndLeftRightPress(event));
},
isNotFromTheNumKeyPad: function (event) {
    return (event.keyCode < 96 || event.keyCode > 105);
},
isNotFromTopRowNumberKeys: function (event) {
    return (event.keyCode < 48 || event.keyCode > 57);
},
theKeyIsNonNumeric: function (event) {
   return (event.shiftKey
           || (this.isNotFromTopRowNumberKeys(event)
                && this.isNotFromTheNumKeyPad(event)));
},
bindInputValidator: function(){
    $('.myinputclassselector').keydown(function (event) {
        if(this.validateKeyPressEvent(event)) return false;
    });
},
validateKeyPressEvent: function(event){
    if(this.theKeyPressedIsEditRelated(event)){
        return;
    } else {
        if (this.theKeyIsNonNumeric(event)) {
            event.preventDefault();
        }
    }
}

Не двигаясь к ответу, я использовал его, но вот реализация с некоторой добавленной логикой для форматирования числа в реальном времени

https://gist.github.com/chrisallick/5560840

$(document).ready(function()
{
    $("#textBoxId").bind("change",checkInput);
});

function checkInput()
{
    // check if $('#textBoxId').val() is under your constraints
    // then change its value, removing the last character
    // since this event will be called each time you
    // type a character
}

Проверьте, используется ли десятичная точка: -

        // Stop: Multiple decimal points
        if((e.keyCode == 190 || e.keyCode == 110) && ((this.value).indexOf(".") >= 0))
            e.preventDefault(); 

Ниже приведен другой подход. Это также позаботится о вклеивании. [это для альфа-числовой проверки]

//Input Validation
var existingLogDescription = "";

$('.logDescription').keydown(function (event) {
    existingLogDescription = this.value;

});


$('.logDescription').keyup(function () {
    if (this.value.match(/[^a-zA-Z0-9 ]/g)) {
        alert("Log Description should contain alpha-numeric values only");
        this.value = this.value.replace(/[^a-zA-Z0-9 ]/g, '');
        this.value = existingLogDescription;
    }
});

Используйте числовое значение jquery. Ниже функция допускает десятичные и числовые значения.
Пример: $ ( "# inputId" ). numeric ({allow: "." });

Я использую эту форму. Кажется правильным, чтобы я разрешал клавиши типа home, end, shift и ctrl, при этом пользователь мог печатать специальные символы:

$("#busca_cep").keydown(function(event) {
    if ( event.keyCode == 46 || event.keyCode == 8 || event.keyCode == 13 || event.keyCode == 16 || event.keyCode == 36 || event.keyCode == 35) {
        if (event.keyCode == 13) {
            localiza_cep(this.value);
        }
    } else {
        if ((event.keyCode < 48 || event.keyCode > 57) && (event.keyCode < 96 || event.keyCode > 105 )) {
            event.preventDefault(); 
        }   
    }
});

Я рекомендую также проверить event.metaKey. Если установлено значение true, пользователь может сделать что-то вроде cmd-A, чтобы выбрать весь текст в поле. Вы тоже должны это позволить.

Этот ответ был совершенным, но мы можем сделать его лучше и мощнее, объединив его с jQuery.Validation плагин.

Используя метод number(), мы можем разработать что-то вроде этого:

$('.numberOnly').keydown(function (event) { 
  if ((!event.shiftKey && !event.ctrlKey && !event.altKey) && 
    ((event.keyCode >= 48 && event.keyCode <= 57) || (event.keyCode >= 96 && event.keyCode <= 105))) 
  // 0-9 or numpad 0-9, disallow shift, ctrl, and alt 
  { 
    // check textbox value now and tab over if necessary 
  } 
  else if (event.keyCode != 8 && event.keyCode != 13 && event.keyCode != 46 && event.keyCode != 37 
    && event.keyCode != 39 && event.keyCode != 9 && event.keyCode != 109 
    && event.keyCode != 189 && event.keyCode != 110 && event.keyCode != 190) 
  // not backsapce (8), enter (13), del (46), left arrow (37), right arrow (39), tab (9), negetive sign (- : 109, 189), or point (. : 110, 190) 
  { 
    event.preventDefault(); 
  } 
  // else the key should be handled normally 
}); 
// _____________________________________________
jQuery.validator.setDefaults({ 
  debug: true, 
  success: "valid" 
}); 
// _____________________________________________
$(document).ready(function(){ 
  $('#myFormId').validate({ 
    rules: { 
      field: { 
        required: true, 
        number: true 
      } 
    } 
  }); 
}); 

Итак, любое текстовое поле в форме "#myFormId" с классом "numberOnly" принимает только число, включающее десятичное число, float и даже отрицательное число. Voila:)

PS: В моем случае по какой-то причине я использовал jQuery.validator.addMethod() вместо .validate():

jQuery.validator.addMethod("numberOnly", function (value, element) { 
var result = !isNaN(value); 
return this.optional(element) || result; 
}, jQuery.format("Please enter a valid number.")); 

(он отлично работает в моем проекте ASP.NET MVC 3 + ненавязчивая проверка JavaScript, hooooooooray!)

jQuery("#no_of").keypress(function(event){
    //Allow only backspace and delete
    if (event.keyCode != 46 && event.keyCode != 8) {
        if (!parseInt(String.fromCharCode(event.which))) {
            event.preventDefault();
        }
    }
});

jQuery("#no_of").keyup(function(e){
    var temp_s= jQuery("#no_of").val();
    var multiply_val= temp_s*10;
    jQuery("#ex-r").html(multiply_val);
});

function Numbers(e)
{
    if($.browser.msie)
    {
        if(e.keyCode > 47 && e.keyCode < 58)
            return true;
        else
            return false;
    }
    else
    {
        if((e.charCode > 47 && e.charCode < 58) || (e.charCode == 0))
            return true;
        else
            return false;
    }
}

Я надеюсь, что это будет работать на всех браузерах.

function validate_profile(frmid) {
    var form = $('#' + frmid);
    var error = $('.alert-danger', form);
    var success = $('.alert-success', form);
    form.validate({
        errorElement: 'span', //default input error message container
        errorClass: 'help-block', // default input error message class
        focusInvalid: true, // do not focus the last invalid input
        ignore: "",
        rules: {
            contact_no: {
                required: true,
                minlength: 10,
                maxlength: 10,
                number: true
            }, email_id: {
                required: true,
                email: true
            }
        },
        invalidHandler: function (event, validator) { //display error alert on form submit   
            success.hide();
            error.show();
            Metronic.scrollTo(error, -7000);
        },
        highlight: function (element) { // hightlight error inputs
            $(element)
                    .closest('.form-group').addClass('has-error'); // un set error class to the control group
            $(element)
                    .closest('.form-group').removeClass('has-success'); // set success class to the control group
        },
        unhighlight: function (element) { // revert the change done by hightlight
            $(element)
                    .closest('.form-group').removeClass('has-error'); // un set error class to the control group
            $(element)
                    .closest('.form-group').addClass('has-success'); // set success class to the control group
            error.hide();
        },
        success: function (label) {
            label.closest('.form-group').removeClass('has-error');
            label.closest('.form-group').addClass('has-success');
        },
        submitHandler: function (form) {
            success.show();
            error.hide();
            form.submit();
        }
    });
}