Is there something missing in my jquery code

Question

I want the escape key to remove/hide a dropdown when a class is being displayed as a block.

On entry to a page there is a dropdown that is not activated until you click on the selection. The code checks to see whether the dropdown class is set to display:block. If so then clicking on the escape key triggers a response.

For now i just want an alert to show.

if ($('body').css('color') === '#353C3A') {
$('body', context).on('keyup', function(evt) {
      if (evt.keyCode === 27) {
           alert('This is just a test to see this message');
     }
});
}

I am expecting to see the alert box once i click on the escape key but i do not. many thanks in advance

I believe `$('body').css('color')` will return color code in rgb format. Try `if ($('body').css('color') === 'rgb(53, 60, 58)'` — Vidhyut Pandya, Dec 28 '18 at 12:03
@Vidhyut Pandya you can still set color in body through css. `body { color:#353C3A; }` not a background color — jned29, Dec 28 '18 at 12:27
You should get into the habit of debugging your code, which includes examining the intermediate values each expression produces. If you had checked the value returned by `$('body').css('color')`, you would immediately see that the outer most `if` statement will never succeed. Your browser contains a extremely powerful debugger that will let you step through your code one line at a time and verify your assumptions about the way your code works. — user229044, Dec 28 '18 at 14:31

score 0 · Answer 1 · answered Dec 28 '18 at 12:10

0

First thing you have to check is from your if statement checking the color of the body. if you have break point or alert inside and it work, then you may proceed on the key press.

For the keypress, I recommend using $(document) instead of body else, you might try to add some div element with class or id.

Here is what I used on my code.

$(document).keypress(function(evt) {
    if (evt.keyCode === 27) {
        alert('This is just a test to see this message');
    }
});

OR

$(document).on('keyup', function(evt) {
    if (evt.keyCode === 27) {
        alert('This is just a test to see this message');
    }
});

answered Dec 28 '18 at 12:10

jned29

477
12
50

You cannot get keycode of `esc`, `shift` and `arrow keys` in keypress event – Vidhyut Pandya Dec 28 '18 at 12:15
@VidhyutPandya, No. I can. You can refer to this - https://stackoverflow.com/questions/3369593/how-to-detect-escape-key-press-with-pure-js-or-jquery and also this - https://stackoverflow.com/questions/1160008/which-keycode-for-escape-key-with-jquery – jned29 Dec 28 '18 at 12:22

score 0 · Answer 2 · answered Dec 28 '18 at 14:27

$('body').css('color') return rgb so your event binding is never assigned. By the way if your body element gets it's color = #353C3A after some events or time delay. You should chek it inside of event handler like tihs.

$('body', context).on('keyup', function(evt) {
    if ($('body').css('color') === '#353C3A') { // hex color must convert to rgb
      if (evt.keyCode === 27) {
           alert('This is just a test to see this message');
      }
    }
});

You could check link below for conovert color hex to rgb:

How to get hex color value rather than RGB value?

Is there something missing in my jquery code

2 Answers2