Javascript在可编辑的表格上移动光标，可在保存行上移动

Question

我有Javascript，光标在上，下移动，在表格中输入。它的作品，但我想在同一行左右移动光标。我怎样才能做到这一点？

我试着和它不工作：

else if (evt.keyCode == 39){ 
    event.preventDefault(); 
    var cellindex = $(this).index() 
    var rowindex = $(this).parents('td').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() 
     } 
     else if (evt.keyCode == 13){ 
       event.preventDefault(); 
      var cellindex = $(this).index() 
      var rowindex = $(this).parents('tr').index() + 1 
      $(this).parents('table').find('tr:eq('+rowindex+') td:eq('+cellindex+')').focus() 
     } 
    }) 
}); 

Answer 1

添加到您的代码，最后else if (evt.keyCode == 13){后：

// other key handlers [...] 
} 
else if (evt.keyCode == 39){ 
    event.preventDefault(); 

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

    var rowindex = $(this).parents('tr').index(); 
    var cellindex = $(this).index() - 1; 
    $(this).parents('table').find('tr:eq('+rowindex+') td:eq('+cellindex+')').focus() 
} 

evtKeyCode == 39是按下右箭头，evt.keyCode == 37是左箭头。

基本上，你所要做的就是从你以前的东西中翻转行索引和单元格索引。

Here's a CodePen of it working