GridView点击行变色
0
最佳答案
0
建议用脚本来实现，可以看看 Gmail 邮箱中选中和取消邮件时背景的改变和恢复。
--------------------------------
onclick 时判断 className ，是某个特定 className 时则还原，否则将特定className加载。
有多行的话先遍历将所有行并加载默认 className，再将选中行加载特定className。
--------------------------------
完整代码：
<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
GridView1.DataSource = DataSet; //数据绑定
GridView1.DataBind();
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>无标题页</title>
function SetBGC()
{
var style;
var obj = document.getElementById("GridView1").getElementsByTagName("tr");
for(var i=0; i<obj.length; i++){
obj[i].onclick=function(){
style = this.style.background; //记录当前样式 （背景）
for(var j=0; j<obj.length; j++){
obj[j].style.background = ""; //将所有行的样式清空
}
this.style.background = style; //还原当前行样式
this.style.background = this.style.background == "#ff0000" ? "" : "#ff0000"; //调整将当前行样式
}
}
}
if(window.attachEvent)
window.attachEvent("onload",SetBGC);
//or <body onload="SetBGC();">
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:GridView ID="GridView1" EnableViewState="false" runat="server">
</asp:GridView>
</div>
</form>
</body>
</html>
---------------------------------
再次点击当前行， IE6 下是可以了，但在 FirFox 还是没有变回原背景色，期待高手！
浏览器的兼容性真是烦人啊！
其他回答(3)
0
onclick事件中将当前行的className改变，便在一个全局变量中记录当前行的ID ，
下一次点击另一行时通过那个变量获取上一次选中行 把className改成默认，再将当前行的className改变
0
你原来应该是在onclick里写过类似这样的代码：
td.style.background="#ff0000";
改成这样：
td.style.background= td.style.background=="#ff0000"?"":"#ff0000";
这样就可以在再次点击时恢复原来的颜色了
0
二楼的做法不错！！
