大家帮看看吧。就是想实现点某一行的<input>这一行的<input>都可以突出显示。谢谢啦^-^

Question

改变TR的背景好像更加好(TD不要设置背景)

Answer 1

改变TD的背景啊！FOCUS改变背景！
鼠标移开再改回来！

Answer 2

<table onMouseOver="if (!seted) setTable(this)" width="100%"  border="1" cellspacing="0" cellpadding="0">
  <tr>
    <td><input type="text"></td>
    <td><input type="text"></td>
  </tr>
  <tr>
    <td><input type="text"></td>
    <td><input type="text"></td>
  </tr>
</table>
<script language="javascript">
var seted=false
var defColor="#F0F0F0"
function setTable(oTable){
var oT=oTable.getElementsByTagName('input')
for (var i=0;i<oT.length;i++){
oT[i].onfocus=mouseIn;
oT[i].onblur=mouseOut;
}
seted=true
}
function mouseIn(){
var oT=event.srcElement
oT.style.backgroundColor=defColor
while ((oT.tagName!='TR')&&(oT.tagName!='BODY')){
oT=oT.parentElement
}
oT.bgColor=defColor
}
function mouseOut(){
var oT=event.srcElement
oT.style.backgroundColor=''
while ((oT.tagName!='TR')&&(oT.tagName!='BODY')){
oT=oT.parentElement
}
oT.bgColor=''
}
</script>

Answer 3

列表那个表格一定要加一个：onMouseOver="if (!seted) setTable(this)"

Answer 4

这样就不容易看错行了<TABLE border=1 width=100%>
<TR>
<TD>0</TD>
<TD>0</TD>
<TD>0</TD>
<TD>0</TD>
<TD>0</TD>
<TD>0</TD>
</TR>
<TR>
<TD>0</TD>
<TD>0</TD>
<TD>0</TD>
<TD>0</TD>
<TD>0</TD>
<TD>0</TD>
</TR>
<TR>
<TD>0</TD>
<TD>0</TD>
<TD>0</TD>
<TD>0</TD>
<TD>0</TD>
<TD>0</TD>
</TR>
<TR>
<TD>0</TD>
<TD>0</TD>
<TD>0</TD>
<TD>0</TD>
<TD>0</TD>
<TD>0</TD>
</TR>
</TABLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
TRS = document.all.tags("TR")
for (i=0;i<TRS.length;i++)
{
TRS[i].bgColor = i%2?"#CCCCCC":"#FFFFFF"
}
//-->
</SCRIPT>

Answer 5

设置TR的bgColor
<table width="200" border="1" id=tab>
  <tr>
    <td><input type="text" name="textfield">
    <input type="text" name="textfield23"></td>
    <td><input type="text" name="textfield2"></td>
    <td><input type="text" name="textfield22"></td>
  </tr>
  <tr>
    <td><input type="text" name="textfield232"></td>
    <td><input type="text" name="textfield2322"></td>
    <td><input type="text" name="textfield2323"></td>
  </tr>
  <tr>
    <td><input type="text" name="textfield2326"></td>
    <td><input type="text" name="textfield2325"></td>
    <td><input type="text" name="textfield2324"></td>
  </tr>
</table>
<script language="javascript">
var inputs = document.getElementsByTagName("input")
for(var i=0;i<inputs.length;i++)
{
inputs[i].onclick=test
}
function clearColor()
{
for(var i=0;i<tab.rows.length;i++)
{
tab.rows[i].bgColor=""
}
}function test()
{
clearColor()
var obj;
for(obj=event.srcElement;obj.tagName!="TR";obj = obj.parentNode){}
obj.bgColor="red"
}
</script>

Answer 6

列突出显示
<table width="200" border="1" id=tab>
<colgroup id=>
<col id=c0>
<col id=c1>
<col id=c2>
</colgroup>
  <tr>
    <td><input type="text" name="textfield">
    <input type="text" name="textfield23"></td>
    <td><input type="text" name="textfield2"></td>
    <td><input type="text" name="textfield22"></td>
  </tr>
  <tr>
    <td><input type="text" name="textfield232"></td>
    <td><input type="text" name="textfield2322"></td>
    <td><input type="text" name="textfield2323"></td>
  </tr>
  <tr>
    <td><input type="text" name="textfield2326"></td>
    <td><input type="text" name="textfield2325"></td>
    <td><input type="text" name="textfield2324"></td>
  </tr>
</table>
<style>
.selected{background-color:#FF0000;}
</style>
<script language="javascript">
var inputs = document.getElementsByTagName("input")
for(var i=0;i<inputs.length;i++)
{
inputs[i].onclick=test
}
function clearColor()
{
var cols = document.getElementsByTagName("col")
for(var i=0;i<cols.length;i++)
{
cols[i].className=""
}
}function test()
{
clearColor()
var obj;
for(obj=event.srcElement;obj.tagName!="TD";obj = obj.parentNode){}
var n = obj.cellIndex
document.all("c" + n).className = "selected"
}
</script>