更改按鍵選擇

Question

我在表上有功能，我的問題是我想選擇像按向下箭頭選擇第一行等等，請幫助mi（Bootstrap Modal中的My Table）

這是我的代碼。

 if(keycode == '40'){ alert($(this).attr('id')); } 

 <table style="width:100%"> <tr id="row1"> <th>Firstname</th> <th>Lastname</th> <th>Age</th> </tr> <tr id="row2"> <td>Jill</td> <td>Smith</td> <td>50</td> </tr> <tr id="row3"> <td>Eve</td> <td>Jackson</td> <td>94</td> </tr> <tr id="row4"> <td>John</td> <td>Doe</td> <td>80</td> </tr> </table> 

Answer 1

如果您想按鍵或撥打電話，這就是您的需要

document.onkeypress = function (e) {
  var key = e.charCode || e.keyCode

  if(key == '40'){
   alert("hi");          
 }
};

Answer 2

這是一個入門示例！

PS：在用箭頭鍵瀏覽之前，請單擊結果窗口以激活

 $(function() { $('table tr:eq(1)').addClass('selected'); $(document).on("keyup", function(e) { if (e.keyCode === 38) { e.preventDefault(); if ($('table tr.selected').index() != 1) { $('table tr.selected').removeClass('selected').prev().addClass('selected'); } } else if (e.keyCode === 40) { e.preventDefault(); if ($('table tr.selected').index() != $('table tr:last-child').index()) { $('table tr.selected').removeClass('selected').next().addClass('selected'); } } }); }); 

 .selected td { background-color: yellow; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table style="width:100%"> <tr id="row1"> <th>Firstname</th> <th>Lastname</th> <th>Age</th> </tr> <tr id="row2"> <td>Jill</td> <td>Smith</td> <td>50</td> </tr> <tr id="row3"> <td>Eve</td> <td>Jackson</td> <td>94</td> </tr> <tr id="row4"> <td>John</td> <td>Doe</td> <td>80</td> </tr> </table>