JS文件源码:GridColorControl.js =====================================
/*-----------------调用说明----------------- 说明:可用于架设页面事件。 入口函数:OnFocusSet(....) 如:OnFocusSet( "#000000","#FFFFFF","#FFFFFF","#000000" )
实用调用例子: 鼠标事件: onMouseOver=''''OnFocusSet( "#000000","#FFFFFF","#FFFFFF","#000000" )'''' 单击事件: onClick=''''OnFocusSet( "#000000","#FFFFFF","#FFFFFF","#000000" )''''
参数说明: 参数一[color]:未选中时的字体颜色 参数二[backColor]:未选中时的背景颜色 参数三[selectColor]:选中时的字体颜色 参数四[selectBackColor]:选中时的背景颜色 ------------------------------------------*/ var Rows=new Array(); var ShiftStartRow=""; var setColor,setBackColor,setSelectColor,setSelectBackColor;
/*---------主函数入口----------*/ function OnFocusSet( color,backColor,selectColor,selectBackColor ) { setColor = color; setBackColor = backColor; setSelectColor = selectColor; setSelectBackColor = selectBackColor; Set(); }
//-----------操作---------------- function Set() { iRow=window.event.srcElement; do { iRow=iRow.parentElement; } while(iRow.tagName!=''''TR'''') if(event.ctrlKey) { var j=-1; for(i=0;i<Rows.length;i++) { if(iRow==Rows[i]) { j=i;break; } } if(j!=-1) { for(i=j;i<Rows.length-1;i++) { Rows[i]=Rows[i+1]; } Rows.length=Rows.length-1; } else { Rows[Rows.length]=iRow; } ShiftStartRow=iRow; } else if(event.shiftKey) { if(ShiftStartRow!="") { var StartIndex=ShiftStartRow.rowIndex; var EndIndex=iRow.rowIndex; var oTable=iRow.parentElement;Rows.length=0; if(StartIndex < EndIndex) { for(var i=StartIndex;i<EndIndex+1;i++) { Rows.push(oTable.rows[i]); } } if(StartIndex >= EndIndex) { for(var i=EndIndex;i<StartIndex+1;i++) { Rows.push(oTable.rows[i]); } } } } else { Rows.length=1; Rows[0]=iRow; ShiftStartRow=iRow; } changeColor(iRow); }
//------------颜色改变------------ function changeColor(obj) { for(var i=1;i<obj.parentElement.rows.length;i++) { obj.parentElement.rows(i).style.backgroundColor=setBackColor; obj.parentElement.rows(i).style.color=setColor; } var keyValue=""; for(i=0;i<Rows.length;i++) { Rows[i].style.backgroundColor=setSelectBackColor; keyValue += Rows[i].id+","; Rows[i].style.color=setSelectColor; } }
===========================================
后台DataGrid梆定方法:
===========================================
private void dgList_ItemDataBound(object sender, System.Web.UI.WebControls.DataGridItemEventArgs e) { if( e.Item.ItemType==ListItemType.Item || e.Item.ItemType==ListItemType.AlternatingItem || e.Item.ItemType==ListItemType.SelectedItem) { e.Item.Attributes.Add("onClick","OnFocusSet( ''''#000000'''',''''#FFFFFF'''',''''#FFFFFF'''',''''#000000'''' );"); } }
===========================================
前台.aspx文件调用JS即可:
<script language="javascript" src="GridColorControl.js"></script>
[Web开发][ASP.net]DataGrid自定义模版前端代码 [Web开发][ASP.net]DataGrid鼠标事件处理
|