javascript input masking for numeric and english keyboard only

Question

I have an input field that has a masking of "999999999". It works perfectly fine on English keyboard but I am also able to enter Japanese/Chinese characters into it (breaking the masking).

Is there a way to restrict the input to english keyboard numerics only?

<input type="text" id="pin" lang="en">

I also tried the following but it did not work.

$.fn.onlyNumeric = function(config) {
    var defaults = {
    }
    var options = $.extend(defaults, config);
    return this.each(function(){
        $(this).bind('keyup blur', function(){
            $(this).val($(this).val().replace(/[^0-9]/g, ''));
        });
    });
}

$('#pin').onlyNumeric();

Any help?

Answer 1

You could try to use keypress event like this:

$('#pin').on('keypress',function(e){
    if(!$.isNumeric(String.fromCharCode(e.which))) return false;
});

SEE DEMO