GridView选中行变色（无刷新）

最新推荐文章于 2014-10-13 21:37:00 发布

zhaoqiliang527

最新推荐文章于 2014-10-13 21:37:00 发布

阅读量1.2k

点赞数

分类专栏： ASP.NET 文章标签： javascript null server asp

本文链接：https://blog.csdn.net/zhaoqiliang527/article/details/5525878

版权

ASP.NET 专栏收录该内容

71 篇文章 0 订阅

订阅专栏

实现方式:通过javascript进行控制，点击行中任何一个位置，改行被选中变色。

1、首先在.aspx页面块中添加javascript

1 < script type = " text/javascript " >
2     var prevselitem = null ;
3     function selectx(row)
4     {
5              if (prevselitem != null )
6             {
7                 prevselitem.style.backgroundColor = ' #ffffff ' ;
8             }
9             row.style.backgroundColor = ' PeachPuff ' ;
10             prevselitem = row;
11
12     }
13 </ script >
14
15

2、然后修改GridView,添加事件OnRowDataBound,如：

1 < asp:GridView ID = " GridView1 " runat = " server " AllowPaging = " True " AutoGenerateColumns = " False " Width = " 100% " PageSize = " 12 " OnRowDataBound = " GridView1_RowDataBound " >
2 // 省略
3 </ asp:GridView >

3、最后在.aspx.cs页面中添加

1 protected void GridView1_RowDataBound( object sender,GridViewRowEventArgs e)
2     {
3           if (e.Row.RowType == DataControlRowType.DataRow)
4             {
5                 e.Row.Attributes.Add( " onmouseover " , " if(this!=prevselitem){this.style.backgroundColor='#Efefef'} " ); // 当鼠标停留时更改背景色
6                 e.Row.Attributes.Add( " onmouseout " , " if(this!=prevselitem){this.style.backgroundColor='#ffffff'} " ); // 当鼠标移开时还原背景色
7                 e.Row.Attributes.Add( " onclick " , e.Row.ClientID.ToString() + " .checked=true;selectx(this) " );
8             }
9     }
10
11