一种实用的表格行鼠标点击高亮效果
偶尔在看天天基金网净值公告时,从源代码里剥下的一段js代码,感觉比较实用,分享一下(仅IE有效)
 <script  type="text/javascript">
<script  type="text/javascript"> var highlightcolor='#E0F2FE';
var highlightcolor='#E0F2FE'; var clickcolor='#ffedd2';
var clickcolor='#ffedd2';
 function  MouseOver(){
function  MouseOver(){ var source=event.srcElement;
    var source=event.srcElement;         if  (source.tagName=="TD"){
    if  (source.tagName=="TD"){         source=source.parentElement;
        source=source.parentElement; var cells  =  source.children;
        var cells  =  source.children;     if  (cells[0].style.backgroundColor!=highlightcolor&&cells[0].style.backgroundColor!=clickcolor)
        if  (cells[0].style.backgroundColor!=highlightcolor&&cells[0].style.backgroundColor!=clickcolor) for(i=0;i<cells.length;i++){
            for(i=0;i<cells.length;i++){ cells[i].style.backgroundColor=highlightcolor;
                cells[i].style.backgroundColor=highlightcolor; }
            }         }
    } }
}
 function  MouseOut(){
function  MouseOut(){     var source=event.srcElement;
    var source=event.srcElement; if  (source.tagName=="TD"){
    if  (source.tagName=="TD"){     source=source.parentElement;
        source=source.parentElement; var cells  =  source.children;
        var cells  =  source.children;     if  (cells[0].style.backgroundColor!=clickcolor)
        if  (cells[0].style.backgroundColor!=clickcolor)     for(i=0;i<cells.length;i++){
            for(i=0;i<cells.length;i++){ cells[i].style.backgroundColor="";
                cells[i].style.backgroundColor=""; }
            }         }
    } }
}
 function  MouseClick(){
function  MouseClick(){ var source=event.srcElement;
    var source=event.srcElement; if  (source.tagName=="TD"){
    if  (source.tagName=="TD"){     source=source.parentElement;
        source=source.parentElement; var cells  =  source.children;
        var cells  =  source.children; if  (cells[0].style.backgroundColor!=clickcolor)
        if  (cells[0].style.backgroundColor!=clickcolor) for(i=0;i<cells.length;i++)
            for(i=0;i<cells.length;i++) cells[i].style.backgroundColor=clickcolor;
                cells[i].style.backgroundColor=clickcolor;             else
        else for(i=0;i<cells.length;i++)
            for(i=0;i<cells.length;i++) cells[i].style.backgroundColor="";
                cells[i].style.backgroundColor="";     }
    } }
} </script>
</script>
 <table onmouseover="MouseOver()" onclick="MouseClick()"  onmouseout="MouseOut()" cellspacing="0" bordercolordark="#ffffff"  bordercolorlight="#cccccc"  border="1" width="80%" align="center" style="cursor:pointer">
<table onmouseover="MouseOver()" onclick="MouseClick()"  onmouseout="MouseOut()" cellspacing="0" bordercolordark="#ffffff"  bordercolorlight="#cccccc"  border="1" width="80%" align="center" style="cursor:pointer">   <tr>
    <tr> <td>1</td>
      <td>1</td> <td>a</td>
      <td>a</td> <td>b</td>
      <td>b</td>      </tr>
    </tr> <tr>
    <tr> <td>2</td>
      <td>2</td> <td>c</td>
      <td>c</td> <td>d</td>
      <td>d</td>      </tr>
    </tr> <tr>
    <tr> <td>3</td>
      <td>3</td> <td>e</td>
      <td>e</td> <td>f </td>
      <td>f </td>      </tr>
    </tr>   <tr>
    <tr> <td>4</td>
      <td>4</td> <td>g</td>
      <td>g</td> <td>h </td>
      <td>h </td>      </tr>
    </tr>   </table>
</table>

作者:菩提树下的杨过
出处:http://yjmyzz.cnblogs.com
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。
出处:http://yjmyzz.cnblogs.com
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。
 
                     
                    
                 
                    
                


 
                
            
         
         浙公网安备 33010602011771号
浙公网安备 33010602011771号