如何在Datagrid中实现这样的效果

Question

描述: 任意单击Datagrid某一行(比如第一行),则此行变成蓝色,然后单击另外一行(如第三行),则第三行变成蓝色,第一行恢复到原来的颜色.要求: 最好用Javascript编写代码.

Answer 1

Page_load
DataGrind1.Attributes.Add("onclick","c()")<script>
var lastR  =null
function c()
{
 if(lastR)
 {
  lastR.bgColor="#FFFFFF"
 }
 obj = event.srcElement
 while(obj.tagName!="TR")
 obj =obj.parentElement
 obj.bgColor="blue"
 lastR = obj
}
</script>
<table id=Datagrid1 onclick="c()">
<tr><td>a</td></tr>
<tr><td>a</td></tr>
<tr><td>a</td></tr>
<tr><td>a</td></tr>
<tr><td>a</td></tr>
</table>

Answer 2

我用的是Datagrid控件，不是Table。
<asp:datagrid id="DataGrid1" runat="server" >
<Columns>
<asp:BoundColumn DataField="UserID" SortExpression="UserID"></asp:BoundColumn>
<asp:BoundColumn DataField="UserName" SortExpression="UserName"></asp:BoundColumn>
</Columns> </asp:datagrid>
---------------------------------------------------------------------------------
if ((e.Item.ItemType == ListItemType.Item) || (e.Item.ItemType == ListItemType.EditItem) || (e.Item.ItemType == ListItemType.AlternatingItem))
{ e.Item.Attributes.Add("onclick","currentcolor=this.style.backgroundColor;this.style.backgroundColor='#6699ff'");
}
---------------------------------------------------------------------------------
在DataGrid1_ItemDataBound中写上面一段代码，但是点击其他行时，原来的行仍然不恢复原来颜色。

Answer 3

e.Item.Attributes.Add("onclick","c(this);");function c(obj){
  var table = document.getElementById("dataGrid1");
  var trs = table.getElementsByTagName("tr");
  for(var i=0; i<trs.length;i++){
      trs[i].bgColor = "原来的";
  }
  obj.bgColor = "#new";
}