Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    New to the CF scene
    Join Date
    Sep 2008
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Keypress event question

    Okay so I am pretty new to javascript and i am having troubles with the onkeypress event. I am trying to make it so when you press any key a variable goes up by 1 and then shows it in the browser. But i don't want it to write extra numbers every time. So say the variable is at 3 and you press a key i want the 3 to change to 4 rather then a 4 popping up next to the 3.

    Here's what i have so far...

    <html>
    <head>
    <title>Key Press Test</title>
    <script type="text/javascript">
    var a = 0
    function add()
    {
    a += 1
    document.write(a);
    }
    </script>
    </head>
    <body>
    <script type="text/javascript">
    document.onkeypress="add()"
    </script>
    </body>
    </html>

    I got this to work once when I put the onkeypress event in the body tag but then it only let my press the key once and then the page kept loading. So how would I go about fixing this code?

  • #2
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,159
    Thanks
    203
    Thanked 2,548 Times in 2,526 Posts
    Naturally onkeypress will only work if the document or field is in focus.
    Code:
    <html>
    <head>
    <title>Key Press Test</title>
    <script type="text/javascript">
    var a = 0;
    function add() {
    a += 1;
    document.getElementById("div1").innerHTML = a;
    }
    
    </script>
    </head>
    
    <body>
    <input type = "text" name = "txt1" onkeypress="add()"><br>
    <input type = "text" name = "txt2" onkeypress="add()"><br>
    <div id = "div1"></div>
    </body>
    </html>
    or if you want to use document.onkeypress:-

    Code:
    <html>
    <head>
    <title>Key Press Test</title>
    <script type="text/javascript">
    var a = 0;
    function add() {
    a += 1;
    document.getElementById("div1").innerHTML = a;
    }
    document.onkeypress = add;
    </script>
    </head>
    
    <body>
    <input type = "text" name = "txt1" ><br>
    <input type = "text" name = "txt2" ><br>
    <div id = "div1"></div>
    </body>
    </html>

    Quizmaster: In seafood on a restaurant menu, the French word "poisson" translates into English as what?
    Contestant: Chicken
    Last edited by Philip M; 09-08-2008 at 09:39 AM. Reason: Typo

  • #3
    New to the CF scene
    Join Date
    Sep 2008
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts
    thank you so much!!! also sorry it took so long to reply but i was just wondering if there was anyway to make the variable only go up once if your holding the key down so you have to keep tapping the key to make the variable to go up.

  • #4
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,159
    Thanks
    203
    Thanked 2,548 Times in 2,526 Posts
    document.onkeyup = add;

  • #5
    New to the CF scene
    Join Date
    Oct 2008
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    my question is quite similar to the one before. I wanna be able to trap the keypress 33 and 34 (page up and page down) within a webpage. If keypress 33 is done i want it to go to one url... and if keypress 34 is pressed to go to the other url.

    Thank you.

  • #6
    New to the CF scene
    Join Date
    Oct 2008
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    <html>
    <head>
    <title>Key Press Test</title>
    <script type="text/javascript">
    function pageup() {
    pageup.htm
    }
    function pagedown() {
    pagedown.htm
    }
    document.onkeypress(33) = pageup;
    document.onkeypress(34) = pagedown;
    </script>
    </head>

    <body>

    <div id = "div1"></div>
    </body>
    </html>


    that's what i got so far and totally doesn't work... i haven't tried doing anything in years.. can ya tell


  •  

    Posting Permissions

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