鼠标滑过 gridview 背景色发生改变

[ProgramIsLife]

gridview 绑定了10列数据，现在想实现鼠标滑过每一行的数据时，第1到9列的背景色发生变化，查了相关的资料只能做到要变所有的列都发生了变化，相关代码如下：
if (e.Row.RowType == DataControlRowType.DataRow)
{

e.Row.Attributes.Add("onmouseover", " currentcolor =this.style.backgroundColor;this.style.backgroundColor='#cccc00';this.style.cursor='default';");
e.Row.Attributes.Add("onmouseout", "this.style.backgroundColor=currentcolor;this.style.cursor='default';");

}


我要在这里哪些代码才能控制发生变化的列啊？

在线等啊

[plsandslp]

用javascript添加onmouse事件

[plsandslp]

应该是在rowcommand事作

[ProgramIsLife]

我是在rowdatabound事件中，原代码如下：
protected void gvmetirial_RowDataBound(object sender, GridViewRowEventArgs e)
{


if (e.Row.RowType == DataControlRowType.DataRow)
{


e.Row.Attributes.Add("onmouseover", " currentcolor =this.style.backgroundColor;this.style.backgroundColor='#cccc00';this.style.cursor='default';");
e.Row.Attributes.Add("onmouseout", "this.style.backgroundColor=currentcolor;this.style.cursor='default';");

}



}


我想在这里加代码

[以专业开发人员为伍]

你研究一下Row里边都有哪些属性就行了。

[ProgramIsLife]

我都看了啊，还是找不到头绪来，郁闷啊

[以专业开发人员为伍]

if (e.Row.RowType == DataControlRowType.DataRow)
{
for(int i=0;i<9;i++)
{
TableCell tc=e.Row.Cells[i];
tc.Attributes.Add("onmouseover", " currentcolor =this.style.backgroundColor;this.style.backgroundColor='#cccc00';this.style.cursor='default';");
tc.Attributes.Add("onmouseout", "this.style.backgroundColor=currentcolor;this.style.cursor='default';");
}
}



}

[以专业开发人员为伍]

e.Row是一个 TableRow对象（的子类），而TableRow类对象内部就是使用Cells属性给出各个单元格的对象集合。这是对 html的 tr、td 对象的包装而已。学asp.net要深入一些。

[shixiangwen]

用 js 脚本就可以实现。
function grid_onmouseover()
{
var srcElement = window.event.srcElement;
if( srcElement.tagName.toLowerCase() != "td" ) return;
var tr = srcElement.parentElement;
if( tr.rowIndex > 9 || tr.rowIndex < 1) return;
tr.style.backgroundColor = "#DADADA";

}

移出时也这么实现。。。。。。

[shixiangwen]

注意把这个处理 放到 datagrid 的 鼠标事件中

[ztwz]

private void dgChannelList_ItemDataBound(object sender, System.Web.UI.WebControls.DataGridItemEventArgs e)
{
if(e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
{
e.Item.Attributes.Add("onmouseover","this.style.backgroundColor='#439be6'");
e.Item.Attributes.Add("onmouseout","this.style.backgroundColor='#EFF3FA'");
}
偶的是datagrid，不过都一样啦，放到ItemDataBound事件中就行了

[xuan.ye]

protected void gvmetirial_RowDataBound(object sender, GridViewRowEventArgs e)
{


if (e.Row.RowType == DataControlRowType.DataRow)
{


e.Row.Attributes.Add("onmouseover", " currentcolor =this.style.backgroundColor;this.style.backgroundColor='#cccc00';this.style.cursor='default';");
e.Row.Attributes.Add("onmouseout", "this.style.backgroundColor=currentcolor;this.style.cursor='default';");

}



}
应该可以的啊

[plsandslp]

private void DataGrid_gas_ItemDataBound(object sender, System.Web.UI.WebControls.DataGridItemEventArgs e)
{
ListItemType itemType = e.Item.ItemType;
if (itemType == ListItemType.Item )
{

e.Item.Attributes["onmouseout"] = "javascript:this.style.backgroundColor='#dedfde';";
e.Item.Attributes["onmouseover"] = "javascript:this.style.backgroundColor='#fff7ce';cursor='hand';" ;

}
else if( itemType == ListItemType.AlternatingItem)
{
e.Item.Attributes["onmouseout"] = "javascript:this.style.backgroundColor='#ffffff';";
e.Item.Attributes["onmouseover"] = "javascript:this.style.backgroundColor='#fff7ce';cursor='hand';" ;
}
}
这个例子是实现了该效果的

[plsandslp]

不过是03里做的

[shixiangwen]

服务器端绑定是好，但是没个datagrid 都得这么写
不如写个js 只需要在datagrid中加一行代码，而且也不影响效率，写好的js以后还能在别的页面调用

[以专业开发人员为伍]

哦，我只是简单复制你对e.Item的操作的代码，没有仔细看你的操作内容，现在看看，我那样写会让颜色改变出现在单元格，而不是第1至9个单元格同时改变。实际上只要：

if (e.Row.RowType == DataControlRowType.DataRow)
{
e.Row.Attributes.Add("onmouseover", " currentcolor =this.style.backgroundColor;this.style.backgroundColor='#cccc00';this.style.cursor='default';");
e.Row.Attributes.Add("onmouseout", "this.style.backgroundColor=currentcolor;this.style.cursor='default';");
TableCell tc=e.Row.Cells[8];
tc.BackColor=Drawing.Color.White; //在这里设置不变的背景颜色
}
}

这就足够了。也就是，只要设置单元格的背景色，就可以忽略行的背景色。



楼上grid_onmouseover()的代码不可靠，因为没有准确考虑控件层次。如果单元格内还嵌有单元格，例如模板列里边可能有任何控件，没有区分是内部的单元格还是外部的。

[shixiangwen]

是的，如果存在嵌套单元格，那么脚本在处理时可能会有问题

[ice_bby]

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='#00A9FF'");
//当鼠标移开时还原背景色
e.Row.Attributes.Add("onmouseout", "this.style.backgroundColor=c");
}

这个没有问题