gridview repeater DataList 鼠标经过改变背景颜色

最新推荐文章于 2022-01-09 08:00:00 发布

跳舞的码农

最新推荐文章于 2022-01-09 08:00:00 发布

阅读量732

点赞数

分类专栏： .net

.net 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

1，gridview

双击GridView的OnRowDataBound事件；

在后台的GridView1_RowDataBound()方法添加代码，最后代码如下所示：

protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)  
    {  
        //首先判断是否是数据行  
        if (e.Row.RowType == DataControlRowType.DataRow)  
        {  
            //当鼠标停留时更改背景色  
             e.Row.Attributes.Add("onmouseover", "c=this.style.backgroundColor;this.style.backgroundColor='#C0C0C0'");  
            //当鼠标移开时还原背景色  
             e.Row.Attributes.Add("onmouseout", "this.style.backgroundColor=c");  
         }  
     }

2， repater， datalist

DataList 和 Repeater 在 HTML界面表格<tr>标记中加入如下代码:

view plainprint?
οnmοuseοver="this.style.backgroundColor='FloralWhite'"

οnmοuseοut="this.style.backgroundColor='' "

3， 单双行不同的颜色。而且鼠标移动上去可以变换颜色

<script type="text/javascript">
function fOver(obj){
c=obj.style.backgroundColor;
obj.style.backgroundColor="#CAD3E4";
}
function fOut(obj){
obj.style.backgroundColor=c;
}
</script>
<asp:Repeater ID="rptUser" runat="server">
<ItemTemplate>
<tr style='background-color:<%#(Container.ItemIndex%2==0)?"red":"green"%>' οnmοuseοver="fOver(this);" οnmοuseοut="fOut(this);">
<td><%#Eval("UID")%></td>
</tr>
</ItemTemplate>
</asp:Repeater>