当DataGrid合并行是,怎么用JavaScript写行变色效果。
1
private void grdSearchResults_ItemDataBound(object sender, System.Web.UI.WebControls.DataGridItemEventArgs e)2

{3
ListItemType itemType = (ListItemType)e.Item.ItemType;4

5
if ((itemType != ListItemType.Footer) && (itemType != ListItemType.Separator))6

{7
8
// Add attributes to the <td>.9
string tableRowId = grdSearchResults.ClientID + "_row" + e.Item.ItemIndex.ToString();10
e.Item.Attributes.Add("id", tableRowId);11
object checkBox = e.Item.FindControl("chkChoice");12
if(checkBox != null)13

{14
string clientId = ((CheckBox)checkBox).ClientID;15
e.Item.Attributes.Add("onMouseMove", "Javascript:chkSelect_OnMouseMove('" + tableRowId + "','" + clientId + "',"+e.Item.ItemIndex+")");16
e.Item.Attributes.Add("onMouseOut", "Javascript:chkSelect_OnMouseOut('" + tableRowId + "','" + clientId + "'," + e.Item.ItemIndex + ")");17
((CheckBox)checkBox).Attributes.Add("onClick", "Javascript:chkSelect_OnClick('" + tableRowId + "','" + clientId + "'," + e.Item.ItemIndex + ")");18
}19
}20
}1

/**//*2
描述:鼠标移入事件3
作者:南守拥4
时间:2006年12月13日5
参数:tableRow为TR的ID,checkBox此行的选择CheckBox,rowIndex行号。 6
*/7
function chkSelect_OnMouseMove(tableRow, checkBox,rowIndex)8

{9
var tr = document.getElementById(tableRow);//等到当前行10
var strTableRowBase = tableRow.substr(0,20);//当前行ID的不变部分 11
var chbselect;12
var bgColor; //选择CheckBox13
var rowspan = tr.cells[0].rowSpan; //当前行的RowSpan14
while(rowspan == 1) //如果当前行不是合并行的起点15

{16
rowIndex = rowIndex - 1; //行序号少一17
var strTableRow = strTableRowBase + rowIndex;//上一行的行ID18
tr = document.getElementById(strTableRow);//得到上一行19
rowspan = tr.cells[0].rowSpan;//得到上一行的RowSpan20
}//当找行的合并行起点时退出,当前行的信息有:tr、rowIndex、rowspan chbBase+rowIndex+2+chbLast21
22
//找到合并行起点的选择CheckBox23
var chbBase = checkBox.substr(0,21);24
var chbLast = checkBox.substr(22,32);25
var num = rowIndex + 2;//这里很危险,是看Html直接定的。26
var chbSelectID = chbBase + num + chbLast;27
var chbselect = document.getElementById(chbSelectID);28
if(chbselect != null)29

{30
if(chbselect.checked == false)//如果没被选择则变色。31
bgColor = "#ffffcc";32
}33
34
for(i = rowIndex;i<rowIndex + rowspan;i++)//从起点行开始,给每行设置bgColor35

{36
var strTableRow = strTableRowBase + i;37
tr = document.getElementById(strTableRow);38
tr.style.backgroundColor = bgColor;39
}40
} 41
42

/**//*43
描述:鼠标移出事件44
作者:南守拥45
时间:2006年12月13日46
参数:tableRow为TR的ID,checkBox此行的选择CheckBox,rowIndex行号。 47
*/48
function chkSelect_OnMouseOut(tableRow, checkBox, rowIndex)49

{50
var tr = document.getElementById(tableRow);//等到当前行51
var strTableRowBase = tableRow.substr(0,20);//当前行ID的不变部分 52
var chbselect;53
var bgColor; //选择CheckBox54
var rowspan = tr.cells[0].rowSpan; //当前行的RowSpan55
while(rowspan == 1) //如果当前行不是合并行的起点56

{57
rowIndex = rowIndex - 1; //行序号少一58
var strTableRow = strTableRowBase + rowIndex;//上一行的行ID59
tr = document.getElementById(strTableRow);//得到上一行60
rowspan = tr.cells[0].rowSpan;//得到上一行的RowSpan61
}//当找行的合并行起点时退出,当前行的信息有:tr、rowIndex、rowspan chbBase+rowIndex+2+chbLast62
63
//找到合并行起点的选择CheckBox64
var chbBase = checkBox.substr(0,21);65
var chbLast = checkBox.substr(22,32);66
var num = rowIndex + 2;//这里很危险,是看Html直接定的。67
var chbSelectID = chbBase + num + chbLast;68
var chbselect = document.getElementById(chbSelectID);69
if(chbselect != null)70

{71
if(chbselect.checked == false)//如果没被选择则变色。72
bgColor = "#ffffff";73
}74
75
for(i = rowIndex;i<rowIndex + rowspan;i++)//从起点行开始,给每行设置bgColor76

{77
var strTableRow = strTableRowBase + i;78
tr = document.getElementById(strTableRow);79
tr.style.backgroundColor = bgColor;80
} 81
}82
83
84

/**//*85
描述:鼠标移出事件86
作者:南守拥87
时间:2006年12月13日88
参数:tableRow为TR的ID,checkBox此行的选择CheckBox,rowIndex行号。 89
*/90
function chkSelect_OnClick(tableRow, checkBox, rowIndex)91

{ 92
var chbselect = document.getElementById(checkBox);93
var strTableRowBase = tableRow.substr(0,20);//当前行ID的不变部分 94

95
if(chbselect != null)96

{97
var bgColor;98
if(rowIndex%2 == 0)99
bgColor = "#ffffff";100
else101
bgColor = "#f5f5f5";102
if(chbselect.checked == true)103
bgColor = "#b0c4de"; 104
}105
var tr = document.getElementById(tableRow);106
var rowspan = tr.cells[0].rowSpan;107
for(i = rowIndex;i<rowIndex + rowspan;i++)//从起点行开始,给每行设置bgColor108

{109
var strTableRow = strTableRowBase + i;110
tr = document.getElementById(strTableRow);111
tr.style.backgroundColor = bgColor;112
} 113
}

浙公网安备 33010602011771号