利用JS来控制键盘的上下左右键(示例代码)
利用JS来控制键盘的上下左右键(示例代码)
发布时间:2016-12-30 来源:查字典编辑
摘要:这是一个JS初级代码,想学JS的朋友,可以研究下或者扩展下,最好能用JS实现整个键盘的控制,那感觉就很有意思了。具体代码如下:复制代码代码如...

这是一个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">

<;

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>

推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
相关阅读
网友关注
最新Javascript教程学习
热门Javascript教程学习
编程开发子分类