日期:2014-05-16  浏览次数:20385 次

请问如何在鼠标经过表格的某行时变色
如题 在鼠标经过表格的任意一行时这行就改变颜色 离开后此行又恢复原来的颜色 请高手多多指教!

------解决方案--------------------
参考一下
HTML code
<style>
.commen{
    background:#666666;
}
.current{
    background:red;   
}
</style>
<script>
window.onload=function(){
      var trs=document.getElementById('t1').getElementsByTagName('tr');
      var tr=null;
      for(var i=0;i<trs.length;i++){
      
            tr=trs[i];
             tr.onmouseover=function(){
                  for(var i=0;i<trs.length;i++) trs[i].className='commen';
                     this.className='current';
             }
             tr.onmouseout=function(){
                    this.className='commen';
             }
      }  
}
</script>
<table id="t1" width="750" align="center" border="1px solid blue;">
<tr class='commen'><td>aaaaa</td></tr>
<tr class='commen'><td>bbbbb</td></tr>
<tr class='commen'><td>ccccc</td></tr>
</table>

------解决方案--------------------
JScript code
<style>
.commen{background:#666666}
.current{background:red}
</style>
<table width="750" align="center" border="1px solid blue;">
<tr class='commen'><td>aaaaa</td></tr>
<tr class='commen'><td>bbbbb</td></tr>
<tr class='commen'><td>ccccc</td></tr>
</table>
<script>
var tr=document.getElementsByTagName('tr');
for(var i=0;i<tr.length;i++){
     tr[i].onmouseover=function(){
             this.className='current';
     }
     tr[i].onmouseout=function(){
            this.className='commen';
     }
}
</script>