Keyboard input for a 'clear all' function on a Javascript calculator

Question

I use this code for keyboard input on a calculator in Javascript. All the numbers and the decimal work, but the 'clear all' doesn't. Does anyone have an idea why? Am I using a wrong ascii code?

//Add keyboard input
$(document).keypress(function(event){
    var keycode = (event.keyCode ? event.keyCode : event.which);
    if (keycode === 49) {
        $("#one").click();
   } else if (keycode === 50) {
        $("#two").click();
    } else if (keycode === 51) {
        $("#three").click();
    } else if (keycode === 52) {
        $("#four").click();
    } else if (keycode === 53) {
        $("#five").click();
    } else if (keycode === 54) {
        $("#six").click();
    } else if (keycode === 55) {
        $("#seven").click();
    } else if (keycode === 56) {
        $("#eight").click();
    } else if (keycode === 57) {
        $("#nine").click();
    } else if (keycode === 48) {
        $("#zero").click();
    } else if (keycode === 127 || keycode === 08) {
        $("#clearall").click();
    } else if (keycode === 46 || keycode === 44) {
        $("#decimal").click();
    }  
});

You can find the complete project on JSFiddle: http://jsfiddle.net/depauw/XfRDx/ I don't think that the 'clearall' function is broken. when i push the button on the screen, the clear all function is executed.

What i want to achieve is: when a user made a mistake inputting his/her number, he/she can delete it by pressing the delete button and/or the backspace button.

I already tried replacing 'keypress' by keydown of keyup, but that disabled the keyboard input. That was probably a stupid mistake, but i'm a real beginner, learning with tutorials, sample codes, and bits of code from everywhere!

Kind regards for your help!!!, Christophe

What keys should run the `#clearall`? Also, it may be the function on the `clearall` that's actually broken. And **why** are you simulating button clicks, instead of just calling their event handlers?! — Cerbrus, Jun 30 '14 at 07:23
I believe you are trying "Backspace" and it's not working. That's because you have used the code "08" which is interpreted as Octal, and there is no number "8" in Octal. Instead, change the line to `keycode === 127 || keycode === 08` and try — Rohit Aggarwal, Jun 30 '14 at 07:24
have a look [here](http://stackoverflow.com/questions/4843472/javascript-listener-keypress-doesnt-detect-backspace) — BeNdErR, Jun 30 '14 at 07:24
user3553497, we would love to help you, but we need some input from your side to do so. Can you answer the questions we asked you? — Cerbrus, Jun 30 '14 at 07:36

Vicky · Accepted Answer · 2014-06-30T07:31:26.180

0

The problem is due to keypress function. Use keyup function instead keypress. keyup has more capability to handle native keys. See jquery documentation.

    $(document).keyup(function(event){  /*your stuff is here */   });

Checkout a good explanation of difference between these jquery events

http://howtodoinjava.com/2013/12/20/jquery-keyup-function-demo/

edited Jun 30 '14 at 07:31

answered Jun 30 '14 at 07:24

Vicky

603
5
6

Don't just say __what__ is causing the problem, also explain __why__. At very least link to the docs that explain why, instead of only mentioning it. – Cerbrus Jun 30 '14 at 07:26
A good explanation is here http://howtodoinjava.com/2013/12/20/jquery-keyup-function-demo/ – Vicky Jun 30 '14 at 07:29
You're still not explaining what you mean with _"keyup has more capability to handle native keys."_ – Cerbrus Jun 30 '14 at 07:33
I worked it out: i used 'keydown' and changed the ascii codes into keycodes. Now everything is working fine! I like to thank everyone for the suggestions and helping me on the way! – Christophe Jul 01 '14 at 21:33

Keyboard input for a 'clear all' function on a Javascript calculator

1 Answers1