この記事では、JavaScriptの上下矢印キーによるテーブル行の選択と強調表示を制御する方法について説明します。参照のためにそれを共有してください。特定の実装方法は次のとおりです。
<style> tr.highlight {background：＃08246b;色：White;} </style> <table id = "ice"> <tr onclick = "selecttr（）; return false;"> <td> 123 </td> <td> 234 </td> <td> abc </td> <td> def </td> </tr> <tr onclick = " <td> abc </td> <td> def </td> </tr> <tr onclick = "selecttr（）;"> <td> 123 </td> <td> 234 </td> <td> abc </td> <td> def </td> </tr <tr <tr onclick = "> </td> <td> 234 </td> <td> abc </td> <td> def </td> </tr> <tr onclick = "selecttr（）;"> <td> 123 </td> <td> 234 </td> <td> abc </td> <td> <td> 234 </td> <td> abc </td> <td> def </td> </tr> </table> <スクリプト言語= "javascript"> <！ - var currentline = -1; document.onkeydown = function（e）{e = window.event || e; switch（e.keycode）{ケース38：currentline--; changeItem（）;壊す;ケース40：CurrentLine ++; changeItem（）;壊す;デフォルト：break; }} function selecttr（）{currentline = window.event.srcelement.parentelement.rowindex; // alert（currentline）; changeItem（）;} //選択項目function function changeitem（）{if（document.all）var it = document.getElementbyId（ "ice"）。子供[0]; else var it = document.getElementById（ "ICE"）; for（i = 0; i <it.Rows.length; i ++）{it.rows [i] .classname = ""; } if（currentline <0）currentLine = it.rows.length -1; if（currentline == it.rows.length）currentLine = 0; it.rows [currentline] .classname = "highlight"; } // - > </script>この記事がみんなのJavaScriptプログラミングに役立つことを願っています。