使用 jQuery 对表格进行 Keydown

Question

我有以下 Javascript，如果我应该按下向下箭头，光标将向下移动到下一行。我似乎无法做到这一点。有什么建议吗？

jQuery

$('td').keypress(function(evt){
    if(evt.which == 40){
        event.preventDefault();
        var cellindex = $(this).index()
        var rowindex = $(this).parents('tr').index() + 1
        $(this).parents('table').find('tr:eq('+rowindex+') td:eq('+cellindex+')').focus()
    }
})

HTML

<table>
  <tr><td contenteditable>My_Name</td><td>Surname</td></tr>
  <tr><td contenteditable>My_Name2</td><td>Surname2</td></tr>
</table>

Answer 1

使用这个：

jQuery(document).ready(function(){

    $('td').keydown(function(evt) {
        if(evt.keyCode == 40) {
            event.preventDefault();
            var cellindex = $(this).index()
            var rowindex = $(this).parents('tr').index() + 1
            $(this).parents('table').find('tr:eq('+rowindex+') td:eq('+cellindex+')').focus()
        }
    });
});

或可用于此代码中的向下和向上键事件

jQuery(document).ready(function(){
$('td').keydown(function(evt){
    if(evt.keyCode == 40){
        event.preventDefault();
        var cellindex = $(this).index()
        var rowindex = $(this).parents('tr').index() + 1
        $(this).parents('table').find('tr:eq('+rowindex+') td:eq('+cellindex+')').focus()
    }else if (evt.keyCode == 38){
            event.preventDefault();
        var cellindex = $(this).index()
        var rowindex = $(this).parents('tr').index() - 1
        $(this).parents('table').find('tr:eq('+rowindex+') td:eq('+cellindex+')').focus()
    }
})
});

jsfiddle