完成功能是DataGrid的页面选中事件、鼠标事件、双击事件改变TR的色彩。代码很简单,只是一点JS操作。
JS文件:GridControl.js =============================
/*------------ DataGrid鼠标事件处理 ------------ 功能:用于数据梆定后鼠标事件 参数说明: obj:对像this fontColor:字体颜色 backColor:背景颜色 ----------------------------------------------*/
var objState
//------------鼠标经过时----------- function OnFoucsMouseOver( obj,fontColor,backColor ) { if ( obj.rowIndex > 0 ) { obj.style.color = fontColor; obj.style.backgroundColor = backColor; } }
//-----------鼠标离开时----------- function OnFoucsMouseOut( obj,fontColor,backColor ) { if ( obj.rowIndex > 0 ) { if ( obj != objState ) { obj.style.color = fontColor; obj.style.backgroundColor = backColor; } } }
//-----------鼠标单击时----------- function OnFoucsClick( obj,fontColor,backColor ) { if ( obj.rowIndex > 0 ) { if ( objState != null ) { objState.style.color = ""; objState.style.backgroundColor = ""; } obj.style.color = fontColor; obj.style.backgroundColor = backColor; objState = obj; } }
//-----------鼠标双击时----------- function OnFoucsDbClick( obj,fontColor,backColor,openUrl ) { //参数openUrl为要开的新窗口的地址 if ( obj.rowIndex > 0 ) { if ( objState != null ) { objState.style.color = ""; objState.style.backgroundColor = ""; } obj.style.color = fontColor; obj.style.backgroundColor = backColor; objState = obj; window.open( openUrl ); } }
==========================================
后台数据梆定例子:
==========================================
private void dgList_ItemDataBound(object sender, System.Web.UI.WebControls.DataGridItemEventArgs e) { // if ( e.Item.ItemIndex != -1 ) { e.Item.Attributes.Add( "onMouseOver","OnFoucsMouseOver(this,''''#FFFFFF'''',''''#000000'''');" ); e.Item.Attributes.Add( "onMouseOut","OnFoucsMouseOut(this,''''#000000'''',''''#FFFFFF'''');" ); e.Item.Attributes.Add( "onClick","OnFoucsClick( this,''''#FFFFFF'''',''''#000000'''' );" ); e.Item.Attributes.Add( "onDblClick","OnFoucsDbClick( this,''''#FFFFFF'''',''''#000000'''',''''about:bank'''' );" ); } }
==========================================
前台.aspx页面调用JS文件:
<script language="javascript" src="GridControl.js"></script>
[Web开发][ASP.net]DataGrid自定义模版前端代码 [Web开发][ASP.net]DataGrid鼠标事件方法
|