Posted in Javascript onDecember 14, 2013
这是一个JS初级代码,想学JS的朋友,可以研究下或者扩展下,最好能用JS实现整个键盘的控制,那感觉就很有意思了。
具体代码如下:
<style> tr.highlight{background:#08246B;color:white;} </style> <table border="1" width="70%" id="ice"> <tr> <td><input type='text'></td> <td><input type='text'></td> <td><input type='text'></td> <td><input type='text'></td> </tr> <tr> <td><input type='text'></td> <td><input type='text'></td> <td><input type='text'></td> <td><input type='text'></td> </tr> <tr> <td><input type='text'></td> <td><input type='text'></td> <td><input type='text'></td> <td><input type='text'></td> </tr> <tr> <td><input type='text'></td> <td><input type='text'></td> <td><input type='text'></td> <td><input type='text'></td> </tr> <tr> <td><input type='text'></td> <td><input type='text'></td> <td><input type='text'></td> <td><input type='text'></td> </tr> </table> <script language="javascript"> <!-- //定义初始化行列 var currentLine=-1; var currentCol=-1; document.onkeydown=function(e){ e=window.event||e; switch(e.keyCode){ case 37: //左键 currentCol--; changeItem(); break; case 38: //向上键 currentLine--; changeItem(); break; case 39: //右键 currentCol++; changeItem(); break; case 40: //向下键 currentLine++; changeItem(); break; default: break; } } //方向键调用 function changeItem(){ if(document.all) var it=document.getElementByIdx_x("ice").children[0]; else var it=document.getElementByIdx_x("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; } var objtab=document.all.ice; var objrow=objtab.rows[currentLine].getElementsByTagName_r("INPUT"); if(currentCol<0){ currentCol=objrow.length-1; }else if(currentCol==objrow.length){ currentCol=0; } objrow[currentCol].select(); //调试使用 it.rows[currentLine].className="highlight"; } //--> </script>
利用JS来控制键盘的上下左右键(示例代码)
声明:登载此文出于传递更多信息之目的,并不意味着赞同其观点或证实其描述。
Reply on: @reply_date@
@reply_contents@