I have the following validation to allow only numbers and a decimal in Javascript

function validate(evt) {
      var theEvent = evt || window.event;
      var key = theEvent.keyCode || theEvent.which;           
      key = String.fromCharCode( key );
      var regex = /[0-9]|\./;
      if( !regex.test(key) ) {
        theEvent.returnValue = false;
        if(theEvent.preventDefault) theEvent.preventDefault();
      }
}

I call this in my textbox element like onkeypress='validate(event)'

This code works fine in IE but when I try the same with Firefox backspace, left and right arrow keys and space does not work.

How would I fix this?

I have the following validation to allow only numbers and a decimal in Javascript

function validate(evt) {
      var theEvent = evt || window.event;
      var key = theEvent.keyCode || theEvent.which;           
      key = String.fromCharCode( key );
      var regex = /[0-9]|\./;
      if( !regex.test(key) ) {
        theEvent.returnValue = false;
        if(theEvent.preventDefault) theEvent.preventDefault();
      }
}

I call this in my textbox element like onkeypress='validate(event)'

This code works fine in IE but when I try the same with Firefox backspace, left and right arrow keys and space does not work.

How would I fix this?

• javascript
• regex
• jsp
• firefox
• gecko

Share Improve this question Follow edited Nov 29, 2013 at 13:37 Wladimir Palant 57.7k1212 gold badges9999 silver badges127127 bronze badges asked Nov 29, 2013 at 10:54 PrasannaPrasanna 2,66199 gold badges4242 silver badges5454 bronze badges 2

• What does "does not work" mean? Do you mean pressing those keys has no effect and you think it should or that pressing those keys has an effect and you think it shouldn't? – Anthony Grist Commented Nov 29, 2013 at 11:14
• 1 Well, here you can use Jquery's event.which property. The event.which property returns which keyboard key or mouse button was pressed for the event. So, only write theEvent.which in your code and backspace and space will work in Firefox. Hope this solution helps. – Aziz Daudkarim Commented Apr 15, 2018 at 6:35

Add a ment  | 

4 Answers 4

Sorted by: Reset to default 1

Using key press is the right solution, but you simply need to attach the event handler by JS (which is considered better practice anyway), and use something like this:

$('#myInput').keypress(function(event){
   validate(event)
});

function validate(evt) {
  var theEvent = evt || window.event;
  var key = theEvent.keyCode || theEvent.which;           
  if (key <48 || key > 57  || key == 190)//keycode is a number between 0 and 9 or '.'
       ...
};

use keyup or keydown instead of keypress

keypress is only supposed to fire when there is a character insert

http://www.quirksmode/dom/events/keys.html

keydown function would work across all browsers. Please use keydown function and it would work!

Ex.:-

$(document).keydown(function (e){
                    if(e.keyCode == 37) // left arrow
                    {

                    //code for left arrow

                    }
                    else if(e.keyCode == 39)    // right arrow
                    {

                   //code for right arrow
                    }
                    });

Try

    //allows number and hyphen only 
    function isNumeric(e)
    {
        var a = e.charCode;
        if(a==0){return;}
        return ((a >= 48 && a <= 57));
    }
    </script>

Firefox Backspace charcode 0.