多行记录点击显示不同的CSS样式

可以在Table或tr中添加以下方法：onmouseover="MouseOver()" onclick="MouseClick()"  onmouseout="MouseOut()"，有了这些方法便可实现CSS样式的变化，具体的js如下：

<script  type="text/javascript">
var highlightcolor='#E0F2FE';
var clickcolor='#ffedd2';
function  MouseOver(){
    var source=event.srcElement;        
    if  (source.tagName=="TD"){  //注意这里的TD是大写      
        source=source.parentElement;
        var cells  =  source.children;    
        if  (cells[0].style.backgroundColor!=highlightcolor&&cells[0].style.backgroundColor!=clickcolor)
            for(i=0;i<cells.length;i++){
                cells[i].style.backgroundColor=highlightcolor;
            }        
    }
}
function  MouseOut(){    
    var source=event.srcElement;
    if  (source.tagName=="TD"){    //注意这里的TD是大写
        source=source.parentElement;
        var cells  =  source.children;    
        if  (cells[0].style.backgroundColor!=clickcolor) 
           
            for(i=0;i<cells.length;i++){
                cells[i].style.backgroundColor="";
            }        
    }
}
function  MouseClick(){
    var source=event.srcElement;
    if  (source.tagName=="TD"){    //注意这里的TD是大写
        source=source.parentElement;
        var cells  =  source.children;
        if  (cells[0].style.backgroundColor!=clickcolor)
            for(i=0;i<cells.length;i++)
                cells[i].style.backgroundColor=clickcolor;            
        else
            for(i=0;i<cells.length;i++)
                cells[i].style.backgroundColor="";    
    }
}
</script>

注意这里的TD是大写，也可以小写，根据自己在Table中的定义的TD是大写还是小写。
这里有个静态页面，可以看到演示效果。