码迷,mamicode.com
首页 > 其他好文 > 详细

GridView 行颜色变化

时间:2015-07-21 17:31:40      阅读:135      评论:0      收藏:0      [点我收藏+]

标签:

 需求1:

    1》鼠标在某行上时该行背景色变成黄色

  2》鼠标离开某行时该行背景色还原到默认颜色

    3》鼠标点击某行时该行背景色变成浅绿色,上次点击的行背景色?还原到默认颜色

实现的Code

protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
    {
        if (e.Row.RowType == DataControlRowType.DataRow)
        {
            //当鼠标放上去的时候 先保存当前行的背景颜色 并给附一颜色
            e.Row.Attributes.Add("onmouseover", "currentcolor=this.style.backgroundColor;this.style.backgroundColor=‘yellow‘,this.style.fontWeight=‘‘;");
            //当鼠标离开的时候 将背景颜色还原的以前的颜色
            e.Row.Attributes.Add("onmouseout", "this.style.backgroundColor=this.style.backgroundColor==‘#99cc00‘? ‘#99cc00‘:currentcolor,this.style.fontWeight=‘‘;");
            //当鼠标点击将背景颜色改变
            e.Row.Attributes.Add("onclick", "if(lastck){lastck.style.backgroundColor=currentcolor;} lastck=this; this.style.backgroundColor=‘#99cc00‘; this.style.color=‘buttontext‘;this.style.cursor=‘default‘;");
        }
    }

页面中添加一个JS变量

<script type="text/javascript">
       var lastck=null;
 </script>

GridView 行颜色变化

标签:

原文地址:http://my.oschina.net/howdo/blog/481326

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!