JS实现光棒效果

1.当鼠标移动到该记录的时候编程蓝色
2.当鼠标移开的时候改记录编程默认颜色(比如白色)
3.当用户选中某一条记录的时候编程红色var Color;
function mouse(obj, affair) {
if (affair == "onmouseover") {
Color = obj.style.backgroundColor;
obj.style.backgroundColor = "#6699ff";
}else if (affair == "onmouseout"){
obj.style.backgroundColor = Color;
}else{
obj.style.backgroundColor = "#FF0000";
}
}求大神, 

解决方案 »

  1.   


      <script type="text/javascript">
      <!--
    function over(obj){
    //var tr = event.srcElement;
    obj.style.backgroundColor="red";
    }
    function out(obj){
    obj.style.backgroundColor="white";
    }
    function clicked(obj){
    obj.style.backgroundColor="green";
    }
      //-->
      </script>
     </head> <body>
      <table border="1">
      <tr onmouseover="over(this)" onmouseout="out(this)" onclick="clicked(this)">
    <td>1111</td>
    <td>2222</td>
    <td>3333</td>
      </tr>
      </table>
     </body>
      

  2.   


    我现在就是这样的效果,
    我想的是这样的,
    比如：
    当用户点击某一行(第一行)的时候这一行的颜色为green,
    并且当鼠标移开的时候颜色还是green，
    鼠标再次移入的时候颜色为red最后当用户再次选中另外一行(第二行)的时候,
    这一行的颜色为green,
    并且当鼠标移开的时候颜色还是green，
    鼠标再次移入的时候颜色为red不知道说的是否清楚,麻烦了
      

  3.   


    <script type="text/javascript">
      <!--
    var lastSelected;  //最后点击的元素
        function over(obj){
            obj.style.backgroundColor="red";
        }
        function out(obj){
    if(obj == lastSelected )
    obj.style.backgroundColor="green";
    else
    obj.style.backgroundColor="white";
        }
        function clicked(obj){
    if(lastSelected != null)
    {
    lastSelected.style.backgroundColor="white";
    }
    lastSelected = obj;
            obj.style.backgroundColor="green";
        }
      //-->
      </script>
     </head> <body>
      <table border="1">
      <tr onmouseover="over(this)" onmouseout="out(this)" onclick="clicked(this)">
        <td>1111</td>
        <td>2222</td>
        <td>3333</td>
      </tr>
      <tr onmouseover="over(this)" onmouseout="out(this)" onclick="clicked(this)">
        <td>1111</td>
        <td>2222</td>
        <td>3333</td>
      </tr>
      </table>
     </body>