Add to the front-end HTML page
<Script language = "JavaScript">
<! --
VaR bcolor = '# ff3300'; // defines the color, which is the color displayed when you click
VaR fcolor = '# fafafa'; // defines the color of the font displayed when you click it.
Function tdover (TD)
{
If (TD. style. backgroundcolor! = Bcolor) // when the background color of this column is not the color defined above
{
TD. setattribute ('dtbg', TD. style. backgroundcolor); // obtain the background color of this column and set it to dtbg.
TD. setattribute ('dtco', TD. style. Color); // obtain the font color of this column and set it to dtco.
TD. style. Color = '# ff66cc'; // you can specify the font color of the column when you move the cursor up to # ff99ff.
TD. style. cursor = 'hand'; // set the Mouse shape to the hand shape
TD. style. backgroundcolor = '#66cc66'; // set the background color of this column to #66cc66
}
}
Function tdout (TD)
{
If (TD. style. backgroundcolor! = Bcolor) // when the background color of this column is not the color defined above
{
TD. style. backgroundcolor = TD. getattribute ('dtbg'); // set the background color of the column to the color obtained above, that is, dtbg.
TD. style. Color = TD. getattribute ('dtco'); // set the background color of the column to the color obtained above, that is, dtco
}
}
Function cleartdcolor (TDC)
{
VaR tdcoll = Document. All. Tags ('tr'); // obtain all rows
BC = TDC. getattribute ('dtbg'); // obtain the background color of the column (in the tdover method, setattribute)
Cc = TDC. getattribute ('dtco'); // obtain the font color of the column (in the tdover method, setattribute)
For (I = 0; I <tdcoll. length; I ++) // loop row
{
Whichtd = tdcoll (I); // obtain the current row
If (whichtd. style. backgroundcolor = bcolor) // if the cell is set to the start color, that is, bcolor
{
// Note: If your DataGrid does not distinguish between common and alternate columns, use the following Code , Clear color
/* Whichtd. style. backgroundcolor = BC; // set the color of the cell to the color obtained.
Whichtd. style. Color = cc; // set the font color of the cell to the expected color.
Whichtd. style. fontweight = '';
Break ;*/
// If your DataGrid is divided into common columns and alternate columns with colors, use the following code to clear the color:
// Tip: pay attention to the following judgment when using it. The modulo judgment may need to be exchanged based on your actual situation.
If (I % 2! = 0) // indicates a normal column. Because there is no color, the following color is ""
{
Whichtd. style. backgroundcolor = "";
Whichtd. style. color = "";
Whichtd. style. fontweight = '';
Break;
}
Else // indicates an alternate column. The following backgroundcolor is set based on the color of the alternate column in your DataGrid.
{
Whichtd. style. backgroundcolor = ""; // # ccffff is the color of the Set DataGrid alternate item (you can modify it as needed)
Whichtd. style. color = "";
Whichtd. style. fontweight = '';
Break;
}
}
}
}
Function tdcolor (TDC)
{
Cleartdcolor (TDC); // first clear all colors
BC = TDC. getattribute ('dtbg'); // obtain the background color of the column (in the tdover method, setattribute)
Cc = TDC. getattribute ('dtco'); // obtain the font color of the column (in the tdover method, setattribute)
TDCS = TDC. style. backgroundcolor; // obtain the current color of the column (that is, the color when the mouse moves to the cell)
If (event. srcelement. tagname! = 'A') // event. srcelement. tagname is the name of the triggered cell, that is, TD
{
If (TDCS! = Bcolor) // if the current color of the column is not equal to the color defined at the beginning
{
TDC. style. backgroundcolor = bcolor; // you can specify the background color as the starting color.
TDC. style. Color = fcolor; // set the background color to the starting font color.
TDC. style. fontweight = '2013 ';
}
Else
{
TDC. style. backgroundcolor = BC; // set the background color (to setattribute in the tdover method)
TDC. style. Color = cc; // set the background color to (setattribute in the tdover method)
TDC. style. fontweight = '';
}
}
}
Function tdcolordbl (TDC) // clear the color of the column
{
Cleartdcolor (TDC );
}
-->
</SCRIPT>
Add it to the itemdatabound event of the DataGrid
If (E. Item. itemtype! = Listitemtype. header)
{
E. Item. Attributes. Add ("onmouseover", "tdover (this )");
E. Item. Attributes. Add ("onmouseout", "tdout (this )");
E. Item. Attributes. Add ("onclick", "tdcolor (this )");
E. Item. Attributes. Add ("ondblclick", "tdcolordbl (this )");
}