JQueryを使用してタブキーで表のセルをナビゲートする方法は？

Question

私は以下のテーブルを持っています。テーブルセル（div要素のあるセルのみ）をクリックすると、編集用のテキストフィールドに変わります（これは別のJqueryプラグインを実行しています）。私はタブキーを使ってこれを達成しようとしています。つまり、1つのセルからタブアウトすると、次のセルに移動します。

<table id="mytable"> 
    <tr> 
      <td><span><div>60</div></span></td> 
      <td><span>$10000</span></td> 
      <td><span><div>100%</div></span></td> 
    </tr> 
</table> 

ここは私のJqueryコードです。このコードは正しく動作しません。つまり、最初のセルからタブアウトすると、次のセルにカーソルが表示されますが、すぐに消えます。このコードで何か間違っていますか？

$("#mytable tr td div").bind('keydown', function(event) { 
    if(event.keyCode == 9){ //for tab key 
    var currentDiv = event.target; 
    $(currentDiv).parents("td").next("td").find("div").click(); 
}}); 

Answer 1

return false;を追加することに役立つ可能性がありますが、それを追加する

$("#mytable tr td div").bind('keydown', function(event) { 
    if(event.keyCode == 9){ //for tab key 
    var currentDiv = event.target; 
    $(currentDiv).parents("td").next("td").find("div").click(); 
    return false; // <== here 
    } 
}); 

あなたはKeyDownイベントを処理している場合、あなたはバブリングからのイベントを停止すると、デフォルトの処理を停止するようにブラウザを言っていることを意味しあなたがしようとしていることに干渉している可能性があります。