Add the following code to the RowDataBound event of the GridView control:
If (e. Row. RowType = DataControlRowType. DataRow)
{
// Change the background color when the mouse moves over the line
E. Row. Attributes. Add ("onmouseover", "c = this. style. backgroundColor; this. style. backgroundColor = '# EE82EE '");
// Restore the background color when you move the mouse away.
E. Row. Attributes. Add ("onmouseout", "this. style. backgroundColor = c ");
}
After the DataList control is added to the design page, I bind data through cells when using DataList, so the mouse effect is implemented on the source code page, as shown in the following example.
<Asp: DataList ID = "DataList1" runat = "server" BorderWidth = "1">
<ItemTemplate>
<Tr onmouseover = "this. style. backgroundColor = '# 8ec26f'" onmouseout = "this. style. backgroundColor ='' ">
<Td>
<Asp: Label ID = "Label1" runat = "server" Text = '<% # DataBinder. eval (Container, "DataItem. ID ") %> '> </asp: Label>
</Td>
<Td>
<Asp: Label ID = "Label2" runat = "server" Text = '<% # DataBinder. eval (Container, "DataItem. area ") %> '> </asp: Label>
</Td>
</Tr>
</ItemTemplate>
<HeaderTemplate>
Header1 </td>
<Td> Header2
</HeaderTemplate>
</Asp: DataList>