矢印キーでフォームをナビゲートする

Question

テーブル（行と列）のように作成されたhtmlフォームがあります。基本的にそれは優れているように見えます。 そして、私は矢印キーでExcelと同じようにナビゲートしたいと思います。それは可能ですか？

<table> 
    <tr> 
     <td/> 
     <td/> 
    </tr>  
    <tr> 
     <td/> 
     <td/> 
    </tr> 
</table> 

Answer 1

はい、私はあなたのヒントを手に入れました。これは私のソリューションです：

var UP = 38; 
    var DOWN = 40; 
    var LEFT = 37; 
    var RIGHT = 39; 
    var TAB = 9; 
    $('#tab-columns').on('keydown', 'input', function (event) { 

     var $focused = $(':focus'); 
     var id = ($focused.parents("td").attr('id')); 
     if (id.startsWith("field_")) {    
      idArr = id.replace("field_", "").split("_"); 
      row = Number(idArr[0]); 
      col = Number(idArr[1]); 

      newId = id; 
      switch (event.which) {   
      case UP: 
       newId = "field_"+(row-1)+"_"+col; 
       break; 
      case DOWN: 
       newId = "field_"+(row+1)+"_"+col; 
       break; 
      case TAB: 
      case RIGHT: 
       newId = "field_"+row+"_"+(col+1); 
       break;     
      case LEFT: 
       newId = "field_"+row+"_"+(col-1); 
       break; 
      default: 
       // nothing 
      } 

      $("#"+newId).find("input").focus(); 
     }