Using Jquery, why is this function being called when I only click one of the two keys?

Question

I have this code:

$(document).bind('keydown', 'ctrl+1', function () {
    alert('You found the hotkey ctrl+1!');
});

but if I click on EITHER Control or 1 key, this code seems to fire. I only want this code to fire when BOTH keys are pressed.

Can anyone clarify what I am missing?

Answer 1

As you can see in the documentation, the second argument to the bind function is eventData, which is

An object containing data that will be passed to the event handler.

This is used to access variables from outside the inner function which you use as a handler, to avoid the problem with accessing a mutable variables from closure.

If you want to filter the keys that trigger the action just handle it inside of the function.

$(document).bind("keydown", function(ev){ // notice the function argument
    if(ev.ctrlKey && ev.keyCode == 49){ // 49 being the keyCode for "1"
        alert("Foo!");
    }
});

Answer 2

You can use the keydown function of jQuery directly and check for the keys pressed.

$('body').keydown(function (e){
    if (e.ctrlKey && e.keyCode == 49)
    alert("Ctrl+1 pressed");
});