欢迎访问我的博客 https://javascript.shop

【原创】datalist repeater 控件的行鼠标单击 以及 滑过特效

原文发布时间为:2009-05-06 —— 来源于本人的百度文章 [由搬家工具导入]

调用方法如:<tr id="<%# Container.ItemIndex+1 %>" onclick="LightRow(this)" onmouseover=" MouseOverColor(this)" onmouseout="MouseOutColor(this)"
objTr.bgColor,objTr.style.backgroundColor 这两种写法自己选着用

单击背景色改变,再次单击背景色还原
<script type="text/javascript">
var oldid="";
function LightRow(objTr)
{
   var newid=objTr.id;
   if(objTr.bgColor!="#ffe7a7") //进制式颜色不能用大写,要用小写
   {
      objTr.bgColor="#ffe7a7";
      if(oldid!=""&&oldid!=newid)
        document.getElementById(oldid).bgColor="";
      oldid=newid;
    }
    else
    {
       document.getElementById(oldid).bgColor="";//作者:http://hi.baidu.com/handboy
     }
}

function MouseOverColor(objTr)
{
   if(objTr.bgColor!="#ffe7a7")
   {
      objTr.bgColor="AliceBlue";
   }
}
function MouseOutColor(objTr)
{
   if(objTr.bgColor!="#ffe7a7")
   {
      objTr.bgColor="";
   }
}
</script>


单击背景色改变,再次单击背景色不改变
<script type="text/javascript">
    var oldid="";
    function LightRow(objTr)
    {
       var newid=objTr.id;
       if(objTr.style.backgroundColor!="#ffe7a7")
       {
          objTr.style.backgroundColor="#ffe7a7";
          if(oldid!=""&&oldid!=newid)
            (document.getElementById(oldid)).style.backgroundColor="White";
          oldid=newid;
        }
    }

    function MouseOverColor(objTr)
    {
       if(objTr.style.backgroundColor!="#ffe7a7")
       {
         objTr.style.backgroundColor="AliceBlue";
       }
    }
    function MouseOutColor(objTr)
    {
       if(objTr.style.backgroundColor!="#ffe7a7")
       {
          objTr.style.backgroundColor="White";
       }
}

posted @ 2017-07-12 00:05  孑孓子  阅读(180)  评论(0编辑  收藏  举报
欢迎访问我的博客 https://javascript.shop