当前位置: 代码迷 >> JavaScript >> 键盘点击图片加框的有关问题
  详细解决方案

键盘点击图片加框的有关问题

热度:144   发布时间:2012-02-24 16:30:39.0
求助键盘点击图片加框的问题
我想用键盘上的某个键对应网页上的图片,按键表示被选中或者取消选中,选中的时候图片要加上一个红框,取消的时候红框消失。代码如下:
function   selectPic(row,collum)
{
var   isSelected   =selectBool[keySpaceNum*9   +   (row)*3   +   collum][0];
if   (isSelected)
{
selectBool[(row)*3+collum][0]   =   false;
var   tempDir   =   "PIC "   +   row   +   "_ "   +   collum;
var   pic   =   document.getElementById(tempDir);
pic.border   =   0;
}
else
{
selectBool[(row)*3+collum][0]   =   true;
var   tempDir   =   "PIC "   +   row   +   "_ "   +   collum;
var   pic   =   document.getElementById(tempDir);
        pic.border   =   3
        pic.style.borderColor   =   "red ";
}
}

function   keyDown()
{
if(event.keyCode==103)
{ selectPic(0,0);}
if(event.keyCode==104)
{ selectPic(0,1);}
if(event.keyCode==105)
selectPic(0,2);
if(event.keyCode==100)
selectPic(1,0);
if(event.keyCode==101)
selectPic(1,1);
if(event.keyCode==102)
selectPic(1,2);
if(event.keyCode==97)
selectPic(2,0);
if(event.keyCode==98)
selectPic(2,1);
if(event.keyCode==99)
selectPic(2,2);
}

但是现在按某个键的时候相应根本不会出现加框,如果在响应中加入alert则红框就会出现,怀疑是没有刷新的问题。
请教各位高手,能不能在不出现alert的情况下正常响应键盘的加红框呢?

------解决方案--------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN " "http://www.w3.org/TR/html4/strict.dtd ">
<html>
<head>
<meta http-equiv= "Content-Type " content= "text/html; charset=iso-8859-1 " />
<title> Untitled Document </title>
<script language=JavaScript>
function changeColor(){
alert( '123 ');
if (window.event.keyCode == 13){
var tds =document.getElementsByTagName( 'td ');
tds[0].style.backgroundColor = 'red ';

}
}
document.onkeydown = changeColor;
</script>
</head>
<body >
<table border=2>
<tr>
<td> 1 </td>
<td> 2 </td>
<td> 3 </td>
<td> 4 </td>
<td> 5 </td>
</tr>
</table>
</body>
</html>

写了个类似的,参考一下吧
------解决方案--------------------
Try:
在 pic.style.borderColor = "red "; 前/后 加一行:

pic.style.borderStyle = "solid ";
  相关解决方案