怎么可以使DataGrid里行的背景色,当鼠标点击时变色?

#1

OnItemCreated(DataGridItemEventArgs e)
{
if(e.Item.ItemType==ListItemType.Item||e.Item.ItemType==ListItemType.AlternatingItem)
{
e.Item.Attributes["onkeydown"] = "this.style.backgroundColor='#FFFF99'";

#2

using System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
using System.Data.SqlClient;
using System.Configuration;
namespace CommonFunction
{
/// <summary>
/// mouseOverRowColor 的摘要说明。
/// </summary>
public class mouseOverRowColor : System.Web.UI.Page
{
protected System.Web.UI.WebControls.DataGrid dgMouseOver;

private void Page_Load(object sender, System.EventArgs e)
{
//页面初试化时进行数据绑定
if(!IsPostBack)
DataGridDataBind();
}

#region Web 窗体设计器生成的代码
override protected void OnInit(EventArgs e)
{
//
// CODEGEN: 该调用是 ASP.NET Web 窗体设计器所必需的。
//
InitializeComponent();
base.OnInit(e);
}

/// <summary>
/// 设计器支持所需的方法 - 不要使用代码编辑器修改
/// 此方法的内容。
/// </summary>
private void InitializeComponent()
{
this.dgMouseOver.ItemDataBound += new System.Web.UI.WebControls.DataGridItemEventHandler(this.changeRowColor);
this.Load += new System.EventHandler(this.Page_Load);

}
#endregion

// ItemDataBound事件
private void changeRowColor(object sender, System.Web.UI.WebControls.DataGridItemEventArgs e)
{
//如果是数据项并且是交替项
if(e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
{
//添加自定义属性，当鼠标移过来时设置该行的背景色为"6699ff",并保存原背景色
e.Item.Attributes.Add("onmouseover","currentcolor=this.style.backgroundColor;this.style.backgroundColor='#6699ff'");
//添加自定义属性，当鼠标移走时还原该行的背景色
e.Item.Attributes.Add("onmouseout","this.style.backgroundColor=currentcolor");

}
}

private void DataGridDataBind()
{
//定义数据连接对象,其中数据库连接字符串是在Web.Config文件中定义的
SqlConnection conn = new SqlConnection(ConfigurationSettings.AppSettings["ConnectionSqlServer"].ToString());
//创建数据适配器对象
SqlDataAdapter da = new SqlDataAdapter("select LastName,FirstName,Title,TitleOfCourtesy,City from Employees",conn);
//创建DataSet对象
DataSet ds = new DataSet();
try
{
//填充数据集
da.Fill(ds,"testTable");
//进行数据绑定
dgMouseOver.DataSource = ds.Tables["testTable"];
dgMouseOver.DataBind();
}
catch(Exception error)
{
Response.Write(error.ToString());
}
}
}
}

#3

<%@ Page language="c#" Codebehind="mouseOverRowColor.aspx.cs" AutoEventWireup="false" Inherits="CommonFunction.mouseOverRowColor" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>mouseOverRowColor</title>
<meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1">
<meta name="CODE_LANGUAGE" Content="C#">
<meta name="vs_defaultClientScript" content="JavaScript">
<meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
</HEAD>
<body MS_POSITIONING="GridLayout">
<form id="Form1" method="post" runat="server">
<h2>鼠标移到DataGrid的那行则更改那行的颜色</h2>
<asp:DataGrid id="dgMouseOver" style="Z-INDEX: 101; LEFT: 56px; POSITION: absolute; TOP: 48px"
runat="server" BorderColor="#CC9966" BorderStyle="None" BorderWidth="1px" BackColor="White"
CellPadding="4">
<SelectedItemStyle Font-Bold="True" ForeColor="#663399" BackColor="#FFCC66"></SelectedItemStyle>
<ItemStyle ForeColor="#330099" BackColor="White"></ItemStyle>
<HeaderStyle Font-Bold="True" ForeColor="#FFFFCC" BackColor="#990000"></HeaderStyle>
<FooterStyle ForeColor="#330099" BackColor="#FFFFCC"></FooterStyle>
<PagerStyle HorizontalAlign="Center" ForeColor="#330099" BackColor="#FFFFCC"></PagerStyle>
</asp:DataGrid>
</form>
</body>
</HTML>

#4

不知道怎么用,请详细,谢谢!

#5

WinForm
DataGrid SelectionBackColor = red

#6

有没有VB的写法,简单的就好一点!

#7

帮帮顶一下

#8

private viod changeRowColor(object sender ,System.Web.UI.WebControls.DataGridItemEventArgs e)
{
if(e.Item.ItemType==ListItemType.Item||e.Item.ItemType.AlternatingItem)
{
e.Item.Attributes.Add("onmouseover","currentcolor=this.style.backgroundColor;this.style.backgroundColor='#6699ff'");
e.Item.Attributes.Add("onmouseout","this.style.backgroundColor=currentcolor");
}}

}

#9

if(e.Item.ItemType == ListItemType.Item  || e.Item.ItemType == ListItemType.AlternatingItem)
{
   e.Item.Attributes.Add("onmouseover","currentcolor=this.style.backgroundColor;this.style.backgroundColor='#6699ff'");
   e.Item.Attributes.Add("onmouseout","this.style.backgroundColor=currentcolor");
}
移上去变色，移开再还原~

#10

可是我是要当点击时当前行(A行)变色,而点击另一行(B行)时(A行)颜色还原,而B行变色

#11

怎么楼上的都好像没有涉及到Click事件的呢????

#12

用js处理的

#13

支持zhuangmin(happy九拍)

#14

用样式表处理不行吗？我都是那样实现的！

#15

怎么用,没用过!

#16

在Click事件里写啊，就稍微改下就可以咯~

#17

设置SelectedItemStyle
<SelectedItemStyle BackColor=red ></SelectedItemStyle>

与ItemStyle
<ItemStyle BackColor=blue HorizontalAlign="Left"></ItemStyle>

Red 为选中的颜色， blue为以前的颜色

<asp:datagrid id="DataGridSuccessful" Runat="server" CssClass="DataGrid" Width="100%" AllowPaging="True"
PageSize="10" PagerStyle-Mode="NumericPages" PagerStyle-HorizontalAlign="Right" AutoGenerateColumns="False">
<SelectedItemStyle BackColor=red ></SelectedItemStyle>
<ItemStyle BackColor=blue ></ItemStyle>

<HeaderStyle HorizontalAlign="Center" CssClass="HeaderStyle"></HeaderStyle>
<Columns><asp:BoundColumn DataField="NO" HeaderText="Serial No"></asp:BoundColumn></Columns>
<Columns><asp:BoundColumn DataField="PANO" HeaderText="Part No"></asp:BoundColumn></Columns>
</asp:datagrid>

#18

这就是你要的！放上去就可以用
Private Sub DataGrid1_ItemDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.DataGridItemEventArgs) Handles DataGrid1.ItemDataBound
If e.Item.ItemType = ListItemType.Item Or e.Item.ItemType = ListItemType.AlternatingItem Then
e.Item.Attributes.Add("onMouseOver", "c=this.style.backgroundColor;")
e.Item.Attributes.Add("onClick", "this.style.backgroundColor='buttonface'")
e.Item.Attributes.Add("onMouseOut", "this.style.backgroundColor=c")
End If
End Sub

#19

楼上的,你的这样还差一点,我要的是点击另一行才把原来那行还原,你的是移动了就还原,我测试了!

#20

你把最后那个
onMouseOut
===》onClick
就可以了

#21

老大具体点行吗/是不是把onmouseout改为onclick,这样不行,我测试了!

#22

学习中

#23

1、页面head部分定义一个变量c，用于保存单击前的颜色；

2、页面head部分定义一个变量line，用于保存单击时行的索引；
<head>
...
<script language="javascript">
var color;
var line = -1;
</script>

Private Sub DataGrid1_ItemDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.DataGridItemEventArgs) Handles DataGrid1.ItemDataBound
    If e.Item.ItemType = ListItemType.Item Or e.Item.ItemType = ListItemType.AlternatingItem Then
        e.Item.Attributes.Add("onMouseOver", "color=this.style.backgroundColor;")
        e.Item.Attributes.Add("onClick", "if (line != -1) {document.getElementById('DataGrid1').rows[line].style.backgroundColor=color;} line = " + (e.Item.ItemIndex + 1) + ";this.style.backgroundColor='buttonface';")
    End If
End Sub

#24

http://singlepine.cnblogs.com/articles/266538.html

#25

在加50分我就回答

#26

没问题,只要你的答案可以用!

#27

using System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
using System.Data.SqlClient;
using System.Configuration;
namespace CommonFunction
{
/// <summary>
/// mouseOverRowColor 的摘要说明。
/// </summary>
public class mouseOverRowColor : System.Web.UI.Page
{
protected System.Web.UI.WebControls.DataGrid dgMouseOver;

private void Page_Load(object sender, System.EventArgs e)
{
//页面初试化时进行数据绑定
if(!IsPostBack)
DataGridDataBind();
}

#region Web 窗体设计器生成的代码
override protected void OnInit(EventArgs e)
{
//
// CODEGEN: 该调用是 ASP.NET Web 窗体设计器所必需的。
//
InitializeComponent();
base.OnInit(e);
}

/// <summary>
/// 设计器支持所需的方法 - 不要使用代码编辑器修改
/// 此方法的内容。
/// </summary>
private void InitializeComponent()
{
this.dgMouseOver.ItemDataBound += new System.Web.UI.WebControls.DataGridItemEventHandler(this.changeRowColor);
this.Load += new System.EventHandler(this.Page_Load);

}
#endregion

// ItemDataBound事件
private void changeRowColor(object sender, System.Web.UI.WebControls.DataGridItemEventArgs e)
{
//如果是数据项并且是交替项
if(e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
{
//添加自定义属性，当鼠标移过来时设置该行的背景色为"6699ff",并保存原背景色
e.Item.Attributes.Add("onmouseover","currentcolor=this.style.backgroundColor;this.style.backgroundColor='#6699ff'");
//添加自定义属性，当鼠标移走时还原该行的背景色
e.Item.Attributes.Add("onmouseout","this.style.backgroundColor=currentcolor");

}
}

private void DataGridDataBind()
{
//定义数据连接对象,其中数据库连接字符串是在Web.Config文件中定义的
SqlConnection conn = new SqlConnection(ConfigurationSettings.AppSettings["ConnectionSqlServer"].ToString());
//创建数据适配器对象
SqlDataAdapter da = new SqlDataAdapter("select LastName,FirstName,Title,TitleOfCourtesy,City from Employees",conn);
//创建DataSet对象
DataSet ds = new DataSet();
try
{
//填充数据集
da.Fill(ds,"testTable");
//进行数据绑定
dgMouseOver.DataSource = ds.Tables["testTable"];
dgMouseOver.DataBind();
}
catch(Exception error)
{
Response.Write(error.ToString());
}
}
}
}

#28

几十层楼高竟然没有什么有用答案

楼主看好了

test.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
<title>Untitled</title>
<style>
.grid{behavior:url(grid.htc);}
</style>
</head>

<body>
<table class="grid" border=1>
<tr bgcolor=blue><td>Hello World!</td></tr>
<tr><td>Hello World!</td></tr>
<tr><td>Hello World!</td></tr>
<tr><td>Hello World!</td></tr>
<tr><td>Hello World!</td></tr>
<tr><td>Hello World!</td></tr>
</table>

</body>
</html>

以下代码存为grid.htc
<public:attach event="ondocumentready" onevent="f_OnDocReady()" />
<script language="JScript">
var oTable,oTBody;
function f_OnDocReady()
{
oTable = this;
oTBody = this.childNodes(0);

for(i=0;i<oTBody.childNodes.length;i++){
    oTBody.childNodes(i).attachEvent("onclick", f_OnClick);
    oTBody.childNodes(i).currentcolor=oTBody.childNodes(i).style.backgroundColor;
}
}
function f_OnClick()
{
for(i=0;i<oTBody.childNodes.length;i++)
    oTBody.childNodes(i).style.backgroundColor=oTBody.childNodes(i).currentcolor;
event.srcElement.parentElement.style.backgroundColor='#00ff00';
}
</script>

实际应用时只须<asp:datagrid style="behavior:url(grid.htc);"
或者
<asp:datagrid class="grid"

#29

专家分我不要，小弟现在在水源混，给我非技术分即可

#30

Truly(null)只有你知道我的心意,Thanks!

#31

vb代码参考,
Private Sub DataGrid1_ItemDataBound(ByVal sender As System.Object, ByVal e As System.Web.UI.WebControls.DataGridItemEventArgs) Handles DataGrid1.ItemDataBound

        If e.Item.ItemIndex > -1 Then

            e.Item.Attributes.Add("ondblclick", "window.open('../bumen/UserEdit.aspx?id=" + Trim(DataGrid1.DataKeys(e.Item.ItemIndex)) + "','_blank',' ')")

            e.Item.Attributes.Add("onmouseover", "this.style.backgroundColor='PeachPuff',this.style.cursor='hand'")

            e.Item.Attributes.Add("onmouseout", "this.style.backgroundColor='#ffffff'")
        End If

    End Sub

#32

白忙活了

怎么可以使DataGrid里行的背景色,当鼠标点击时变色?

32 个解决方案

#1

#2

#3

#4

#5

#6

#7

#8

#9

#10

#11

#12

#13

#14

#15

#16

#17

#18

#19

#20

#21

#22

#23

#24

#25

#26

#27

#28

#29

#30

#31

#32

#1

#2

#3

#4

#5

#6

#7

#8

#9

#10

#11

#12

#13

#14

#15

#16

#17

#18

#19

#20

#21

#22

#23

#24

#25

#26

#27

#28

#29

#30

#31

#32

相关文章