www.webdeveloper.com
Results 1 to 11 of 11

Thread: Strange onkeypress event with ESC in Firefox...

  1. #1
    Join Date
    Jan 2008
    Location
    ncl,uk
    Posts
    56

    Question Strange onkeypress event with ESC in Firefox...

    Hi all,
    I have the following code:

    <input onkeydown="return testKey(event)" type="text"/>
    function testKey(evt)
    {
    var charCode = (evt.which) ? evt.which : event.keyCode;
    alert(charCode)
    }

    - This code works perfectly in IE with no errors
    - In Firefox (Using FireBug to check for JS errors) the code alerts every character fine except for 1 key which is the ESC key. When i press the ESC key in that input field FireBug throws an error saying: "event is not defined". So for some retarded reason Firefox is looking at the event.keyCode part (which is supposed to be used for IE only) for only the ESC key (all other keys dont throw up an error).

    EDIT: Ok i have figured out why its happening now, because Firefox charCode returns 0 and IE returns undefined and when you do 0 || undefined it returns undefined which i didnt think would be the case. Anyone have an idea how to get around the ESC key besides detecting for 0 and undefined?
    Last edited by sekter; 05-14-2010 at 04:58 AM.

  2. #2
    Join Date
    Apr 2003
    Location
    Netherlands
    Posts
    21,654
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html lang="en">
    <head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    
    <script type="text/javascript">
    window.onload=function() {
    document.getElementsByTagName('input')[0].onkeydown = testKey;
    };
    
    function testKey(e) {
    var evt = window.event? window.event : e;
    var keyCode = window.event? evt.keyCode : (evt.charCode || evt.which);
    if(keyCode == 27) {return false;}
    }
    </script>
    
    <style type="text/css">
    * {margin:0;padding:0;}
    </style>
    
    </head>
    <body>
    <form action="#" name="form1">
    <div>
    <input type="text" name="field">
    </div>
    </form>
    </body>
    </html>
    Last edited by Fang; 05-14-2010 at 06:37 AM. Reason: code correction
    At least 98% of internet users' DNA is identical to that of chimpanzees

  3. #3
    Join Date
    Jan 2008
    Location
    ncl,uk
    Posts
    56
    Hi Fang,
    Thank you for that, however if i needed to allow say for example only letters to be input in a field (including things like backspace, left arrow, right arrow, space) am i right in saying that this is the best way to do it?
    var evt = window.event? window.event : e;
    var keyCode = window.event? evt.keyCode : (evt.charCode || evt.which);
    alert(keyCode)

    if ( (keyCode > 64 && keyCode < 91) ||(keyCode > 96 && keyCode < 123) )
    {
    return true;
    }

    if(keyCode==0)
    {
    //check charCode value to see if the key pressed was a left, right arrow or backspace. If it was any of those 3 then also return true
    }

    EDIT: The problem im having is that if i detect certain keys to allow them (like letters only in the above example) then i need to also account for left and right arrow keys which have a keycode value of 0...

    Do you rekon IE would be happy with this?
    Last edited by sekter; 05-14-2010 at 06:24 AM.

  4. #4
    Join Date
    Apr 2003
    Location
    Netherlands
    Posts
    21,654
    Then allow "8,32,37,and 39" Backspace, space, left-arrow and right-arrow
    At least 98% of internet users' DNA is identical to that of chimpanzees

  5. #5
    Join Date
    Jan 2008
    Location
    ncl,uk
    Posts
    56
    I did that before however i ran into a problem, using your code if you allow the 37 keycode (for left arrow) then you are also allowing the "%" character aswell because it has a charCode of 37 and keycode of 0.

  6. #6
    Join Date
    Apr 2003
    Location
    Netherlands
    Posts
    21,654
    No, detect the shiftKey
    Code:
    if(e.shiftKey && keyCode == 53) {alert('&#37;');}
    At least 98% of internet users' DNA is identical to that of chimpanzees

  7. #7
    Join Date
    Jan 2008
    Location
    ncl,uk
    Posts
    56
    Ah right your using onkeydown whereas im using onkeypress that explains it, is it preferable to use the onkeydown instead? (Im just getting mixed up as to which one should be used where).

  8. #8
    Join Date
    Apr 2003
    Location
    Netherlands
    Posts
    21,654
    onkeydown gives more consistent results across browsers.
    At least 98% of internet users' DNA is identical to that of chimpanzees

  9. #9
    Join Date
    Jan 2008
    Location
    ncl,uk
    Posts
    56

    resolved

    Thanks alot Fang i will start using onkeydown from now on.

  10. #10
    Join Date
    Dec 2003
    Location
    Bucharest, ROMANIA
    Posts
    15,428
    See also the differences and the lack of consistency regarding the key capturing in different browsers:

    http://www.quirksmode.org/js/keys.html

  11. #11
    Join Date
    Jan 2008
    Location
    ncl,uk
    Posts
    56
    Thanks Kor, i was actually using this website alot to test for certain keys but when i read the special keys section i didnt realise other keys like arrow keys would also cause problems too.
    Cheers for pointing that out aswell, appreciated

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles