请教一下这段代码在ff下为什么没有效果?

我想实现点击表格中的一行即可高亮显示这一行,如果以前有已经高亮显示的,则去掉去掉以前高亮显示的这一行,这段代码在ie下可以,但是在ff下却不行,所以想请教一下,谢谢!<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>table</title>
<style>
table {
border-collapse: collapse;
border-spacing: 0;
}
.tabletest td{
border:1px solid #3399FF;
width:100px;
height:25px;
line-height:25px;
text-align:center;
}</style>
<script>
function color(){
var tr=document.getElementsByTagName("tr");
for(var i=0;i<tr.length;i++)
{
if(i%2==0)//奇数行
{
tr[i].style.backgroundColor="#66CCCC";
}
tr[i].onclick=function(){
//在高亮显示选中行之前先检查一下之前是否有已经高亮显示的行，如果存在，则还原！
for(var i=0;i<tr.length;i++)
{
if(tr[i].style.backgroundColor=="#ff0000"&&i%2==0)
tr[i].style.backgroundColor="#66CCCC";
if(tr[i].style.backgroundColor=="#ff0000"&&i%2==1)
tr[i].style.backgroundColor="";
}


this.style.backgroundColor="#ff0000";
}
}
}
</script>
</head><body onload="color()">
<table class="tabletest">
<tr>
<td>asa</td>
<td>dfdg</td>
<td>erer</td>
<td>eccxxvc</td>
</tr>
<tr>
<td>ffd</td>
<td>serer</td>
<td>efddd</td>
<td>frgb</td>
</tr>
<tr>
<td>aw</td>
<td>swwr</td>
<td>fedf</td>
<td>de</td>
</tr>
<tr>
<td>fck</td>
<td>aa</td>
<td>qw</td>
<td>ss</td>
</tr>
<tr>
<td>ryt</td>
<td>fgd</td>
<td>dfd</td>
<td>dvd</td>
</tr>
</table>
</body>
</html>

解决方案 »

  1.   

    //alert(tr[i].style.backgroundColor); // rgb(255, 0, 0)
    FF 搞滴鬼，改好了！L@_@K<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>table</title>
    <style>
    table {
        border-collapse: collapse;
        border-spacing: 0;
    }
    .tabletest td{
        border:1px solid #3399FF;
        width:100px;
        height:25px;
        line-height:25px;
        text-align:center;
    }</style>
    <script>
    var tr=document.getElementsByTagName("tr");
    function color(){
        for(var i=0;i<tr.length;i++)
        {
            if(i%2==0)//奇数行
            {
                tr[i].style.backgroundColor="#66CCCC";
            }
            tr[i].onclick=function(){
            //在高亮显示选中行之前先检查一下之前是否有已经高亮显示的行，如果存在，则还原！
                for(var i=0;i<tr.length;i++)
                {
    //alert(tr[i].style.backgroundColor); // rgb(255, 0, 0)
                    if(i%2==0)
                        tr[i].style.backgroundColor="#66CCCC";
                    if(i%2==1)
                        tr[i].style.backgroundColor="";
                }
                this.style.backgroundColor="#ff0000";
            }
        }
    }
    </script>
    </head><body onload="color()">
    <table class="tabletest">
        <tr>
            <td>asa</td>
            <td>dfdg</td>
            <td>erer</td>
            <td>eccxxvc</td>
        </tr>
        <tr>
            <td>ffd</td>
            <td>serer</td>
            <td>efddd</td>
            <td>frgb</td>
        </tr>
        <tr>
            <td>aw</td>
            <td>swwr</td>
            <td>fedf</td>
            <td>de</td>
        </tr>
        <tr>
            <td>fck</td>
            <td>aa</td>
            <td>qw</td>
            <td>ss</td>
        </tr>
        <tr>
            <td>ryt</td>
            <td>fgd</td>
            <td>dfd</td>
            <td>dvd</td>
        </tr>
    </table>
    </body>
    </html>