Question

Lets say I have the following content,

<div id="sectionA"></div>
<div id="sectionB"></div>
<div id="sectionC"></div>

$("#sectionA").bind(keydown, function(events)
{
    alert("section A");
    return false;
});

$("#sectionB").bind(keydown, function(events)
{
    alert("section B");
    return false;
});

$("#sectionA").bind(keydown, function(events)
{
    alert("section C");
    return false;
});

Is this possible, and if not, how can I get this to work?

Answer 1

It can work on items that can have focus. You can make them contenteditable, or as Marc mentioned, give them a tabindex and it will work.

You also want to make sure you’re referencing the event as a string, not as a variable:

$("#sectionA").bind(keydown, function(events)

should be

$("#sectionA").bind('keydown', function(events)

Demo: http://jsfiddle.net/5upvR/