实现DataGrid的某一行随着鼠标的移入移出而改变颜色

最新推荐文章于 2025-11-26 15:15:36 发布

原创最新推荐文章于 2025-11-26 15:15:36 发布 · 1.1k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#datagrid #function #object

本文介绍如何通过ASP.NET中的DataGrid控件实现当鼠标悬停在表格行上时改变其背景颜色的方法。提供了两种实现方案：一是通过C#后台代码添加事件处理程序；二是直接在前端使用JavaScript进行交互控制。

private void DataGrid1_ItemCreated(object sender, System.Web.UI.WebControls.DataGridItemEventArgs e)
{
if(e.Item.ItemIndex!=-1) //鼠标在DataGrid中移动时，选中的那一行显示颜色
{
e.Item.Attributes.Add("onmouseover","this.setAttribute('BKC',this.style.backgroundColor);this.style.backgroundColor='#99cfff'");
e.Item.Attributes.Add("onmouseout","this.style.backgroundColor=this.getAttribute('BKC');");

}
}

或者

在.aspx页面添加如下代码：
<script>
var curColor;
    function MouseOver(Element)
    {
        curColor=Element.style.backgroundColor;
        Element.style.backgroundColor="DarkGray";
        Element.style.cursor="hand";
    }
    function MouseOut(Element)
    {
        Element.style.backgroundColor=curColor;
        Element.style.cursor="default";
    }
</script>

然后再.cs文件中添加如下代码：
在你的绑定DataGrid的代码中添加
foreach(DataGridItem CurRow in this.DataGrid1.Items)
{
CurRow.Attributes.Add("onmouseover","MouseOver(this);");
CurRow.Attributes.Add("onmouseout","MouseOut(this);");
}