Jquery Script Not Working to accept input numbers only

Question

I have written my Jquery script to input number only for textbox. Following is my html code :

<input type="text" name="mobile_number" id="mobile_number" maxlength="10" class="form-control input-md" placeholder="Mobile Number" required="required">

When I try to input some value it accepts both numbers and characters also.

My Jquery Script is :

$("#mobile_number").keydown(function(event) {

if ( event.keyCode == 46 || event.keyCode == 8 || event.keyCode == 9 ) {

}
else {

    if ((event.keyCode < 48 || event.keyCode > 57) && (event.keyCode < 96 || event.keyCode > 105 )) {
        event.preventDefault(); 
    }   
 } });

use regular expression to test number

Awlad Liton
– Awlad Liton

2014-02-05 09:26:24 +00:00
Commented Feb 5, 2014 at 9:26 — Awlad Liton
– Awlad Liton, Commented Feb 5, 2014 at 9:26

Yuvi · Accepted Answer · 2014-02-05 09:45:19Z

2

$(document).ready(function () {
  //called when key is pressed in textbox
  $("mobile_number").keypress(function (e) {
     //if the letter is not digit then display error and don't type anything
     if (e.which != 8 && e.which != 0 && (e.which < 48 || e.which > 57)) {
        //display error message
        $("#errmsg").html("Digits Only").show().fadeOut("slow");
               return false;
    }
   });
});

http://jsfiddle.net/lesson8/HkEuf/1/

I have updated the code here check this out it works as expected .

answered Feb 5, 2014 at 9:45

Yuvi

1852 silver badges10 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

user3274473 · Accepted Answer · 2014-02-05 09:32:48Z

1

Or, you could try an existing solution,

like this one: http://firstopinion.github.io/formatter.js/demos.html

or this one: http://www.decorplanit.com/plugin/

answered Feb 5, 2014 at 9:32

user3274473

Comments

Rohan Kumar · Accepted Answer · 2014-02-05 09:29:15Z

0

Check that you have included any version of jquery, also write your code in $(document).ready() like,

$(function () {
    $("#mobile_number").keydown(function (event) {
        if (event.keyCode == 46 || event.keyCode == 8 || event.keyCode == 9) {

        } else {
            if ((event.keyCode < 48 || event.keyCode > 57) && (event.keyCode < 96 || event.keyCode > 105)) {
                event.preventDefault();
            }
        }
    });
});

Demo

answered Feb 5, 2014 at 9:29

Rohan Kumar

40.7k11 gold badges81 silver badges111 bronze badges

Comments

ghosty89 · Accepted Answer · 2014-02-05 09:37:38Z

0

the range of keyCode for numbers is [95,105]; and [48,57]

$("#mobile_number").keydown(function(event) {
if ( (event.keyCode > 95 && event.keyCode <106)||(event.keyCode > 47 && event.keyCode <58)) {
}
else {

    event.preventDefault(); 
} 
});

answered Feb 5, 2014 at 9:37

ghosty89

864 bronze badges

Comments

user11913484 · Accepted Answer · 2022-01-05 02:51:10Z

0

I use this OneLiner

<input type="number" onkeypress="return /[0-9]/i.test(event.key)">

Or

<input type="text" onkeypress="return /[0-9]/i.test(event.key)">

answered Jan 5, 2022 at 2:51

user11913484

Collectives™ on Stack Overflow

Jquery Script Not Working to accept input numbers only

5 Answers 5

Comments

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related