Обход строк таблицы при добавлении класса

Question

У меня есть таблица, такая как:

<table border="1" width="400" cellpadding="3" cellspacing="3">
    <tr class="keydown"> <!-- Should this be a class? when down arrow is pressed class="selected" should be applied to this-->
        <td>Table Cell</td>
    </tr>
    <tr class="keydown">
        <td>Table Cell</td>
    </tr>
<table>

Когда нажата клавиша со стрелкой вниз (ascii 40 ?? или 31?), Я хочу, чтобы была выбрана первая строка в таблице, то есть класс должен быть применен к ней, чтобы выделить ее (т.е. изменить цвет bg). При повторном нажатии клавиши со стрелкой вниз следует перейти к следующему ряду. Есть ли плагин для этого? Я возился с jQuery, но я совершенно новичок в этом.

JQuery:

<script type="text/javascript">

$().ready(function() {     
    $('#keydown').keypress(function() {
        $("#keydown").addClass("selected");
    }); 
});

</script>

Answer 1

Рекомендуется использовать keyup для таких вещей, какая ключевая информация хранится в аргументе события. Кроме того, ваш документ готов не правильно:

$(function() { // or use: $(document).ready(function() {
    $('.keydown').keyup(function(e) {
        if (e.keyCode === '40')
            $(this).addClass('selected');
    }); 
});