http://blog.csdn.net/bgu/

完成功能是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" type="text/javascript"> </script><script language="javascript" src="GridControl.js"></script>

總結

以上是生活随笔為你收集整理的DataGrid鼠标事件处理的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。