点键盘“上下”按钮时得到行的焦点，同时改变颜色背景色?(请指教)

发现还有好多错。建议最好定义一个全局量。
按自己的思路写了一个，又加了个点击聚焦的功能<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="Seagle.K">
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<script language="JavaScript">
function setRow(otbl, idx)
{
for (var i=0; i<otbl.rows.length; i++)
{
otbl.rows[i].className = "";
} if (typeof idx != 'undefined')
{
otbl.rows[idx].className = "focus";
}
}function getRowIdx(otbl)
{
for (var i=0; i<otbl.rows.length; i++)
{
if (otbl.rows[i].className=="focus")
{
return i;
}
} return 0;//否则返回首行;
}function moverow()
{
var keycode = event.keyCode;
var otbl = document.all("tablename");
var rowsLen = otbl.rows.length;
var currentRowIdx = getRowIdx(otbl);
switch (keycode)
{
case 38://↑
if (currentRowIdx == 0 || currentRowIdx == 1)
{//首行
setRow(otbl, rowsLen-1);
}else
{
setRow(otbl, currentRowIdx-1);
}
break;
case 40://↓
if (currentRowIdx == rowsLen-1)
{//首行
setRow(otbl, 1);
}else
{
setRow(otbl, currentRowIdx+1);
}
break;
default:
}
}function focusrow()
{
var oSrc = event.srcElement;
if (oSrc.offsetParent && oSrc.offsetParent.id == "tablename")
{
var otbl = oSrc.offsetParent; var rowIdx = (oSrc.parentElement.tagName=='TR')?oSrc.parentElement.rowIndex:oSrc.rowIndex; if (rowIdx != 0)
{
setRow(otbl, rowIdx);
}
}
}
</script>
<style type="text/css">
tr.focus{
background-color:#CCCCCF;
}
</style>
</head>
<body onkeydown="moverow()" onclick="focusrow()">
<TABLE id="tablename" name="tablename" style="BORDER-COLLAPSE: collapse" borderColor=#000000
cellSpacing=0 cellPadding=0 width="100%" border=1>
  <Thead bgColor=#ffffff>
    <TD vAlign=center noWrap align=middle width="11%" height=20><FONT
      color=#ff0000>名称</FONT></TD>
    <TD vAlign=center noWrap align=middle width="11%" height=20><FONT
      color=#ff0000>编码</FONT></TD>
    <TD vAlign=center noWrap align=middle width="11%" height=20><FONT
      color=#ff0000>类别</FONT></TD>
    <TD vAlign=center noWrap align=middle width="11%" height=20><FONT
      color=#ff0000>壮态</FONT></TD>
    <TD vAlign=center noWrap align=middle width="11%" height=20><FONT
      color=#ff0000>建档日期</FONT></TD>
    <TD vAlign=center noWrap align=middle width="11%" height=20><FONT
      color=#ff0000>建档人</FONT></TD>
    <TD vAlign=center noWrap align=middle width="11%" height=20><FONT
      color=#ff0000>顺序号</FONT></TD>
    <TD vAlign=center noWrap align=middle width="11%" height=20><FONT
      color=#ff0000>拼音码</FONT></TD></Thead>
<tbody>
  <TR id=1
  onKeyDown="keykessup(this)" bgColor=#ffffff>
    <TD vAlign=center noWrap align=middle width="12%" height=20>科室1</TD>
    <TD vAlign=center noWrap align=middle width="12%" height=20>1001</TD>
    <TD vAlign=center noWrap align=middle width="12%" height=20>1</TD>
    <TD vAlign=center noWrap align=middle width="12%" height=20>1</TD>
    <TD vAlign=center noWrap align=middle width="12%" height=20>05 20 2005
1</TD>
    <TD vAlign=center noWrap align=middle width="12%" height=20>李伟</TD>
    <TD vAlign=center noWrap align=middle width="12%" height=20>1</TD>
    <TD vAlign=center noWrap align=middle width="12%" height=20>NUll</TD></TR>
  <TR id=2
   bgColor=#ffffcc>
    <TD vAlign=center noWrap align=middle width="12%" height=20>科室10</TD>
    <TD vAlign=center noWrap align=middle width="12%" height=20>1002</TD>
    <TD vAlign=center noWrap align=middle width="12%" height=20>1</TD>
    <TD vAlign=center noWrap align=middle width="12%" height=20>1</TD>
    <TD vAlign=center noWrap align=middle width="12%" height=20>05 21 2005
1</TD>
    <TD vAlign=center noWrap align=middle width="12%" height=20>李伟</TD>
    <TD vAlign=center noWrap align=middle width="12%" height=20>2</TD>
    <TD vAlign=center noWrap align=middle width="12%" height=20>NUll</TD></TR>
  <TR id=3 ondblclick=""
  bgColor=#ffffff>
    <TD vAlign=center noWrap align=middle width="12%" height=20>万县</TD>
    <TD vAlign=center noWrap align=middle width="12%" height=20>1008</TD>
    <TD vAlign=center noWrap align=middle width="12%" height=20>1</TD>
    <TD vAlign=center noWrap align=middle width="12%" height=20>1</TD>
    <TD vAlign=center noWrap align=middle width="12%" height=20>05 20 2005
1</TD>
    <TD vAlign=center noWrap align=middle width="12%" height=20>李伟</TD>
    <TD vAlign=center noWrap align=middle width="12%" height=20>8</TD>
    <TD vAlign=center noWrap align=middle width="12%" height=20>NUll</TD></TR>
  <TR id=4 ondblclick=""
  bgColor=#ffffcc>
    <TD vAlign=center noWrap align=middle width="12%" height=20>长寿</TD>
    <TD vAlign=center noWrap align=middle width="12%" height=20>1009</TD>
    <TD vAlign=center noWrap align=middle width="12%" height=20>1</TD>
    <TD vAlign=center noWrap align=middle width="12%" height=20>1</TD>
    <TD vAlign=center noWrap align=middle width="12%" height=20>05 20 2005
1</TD>
    <TD vAlign=center noWrap align=middle width="12%" height=20>李伟</TD>
    <TD vAlign=center noWrap align=middle width="12%" height=20>9</TD>
    <TD vAlign=center noWrap align=middle width="12%" height=20>NUll</TD></TR>
  </tbody></TABLE>
</body>
</html>

调试易

点键盘“上下”按钮时得到行的焦点，同时改变颜色背景色?(请指教)

解决方案 »