DataGrid中鼠标点击、移动后行颜色改变效果

 

效果一：鼠标点击DataGrid一行，就让该行换个颜色，跟鼠标移动效果的区别是，这种点击后即使鼠标移走了，被点击那行照样保持改变后的颜色，这样用户编辑的时候，这一行就和其他各行区别开了。

效果二：鼠标移动到DataGrid某行，就让该行换个颜色。但是这种效果是，随着鼠标移动而改变行颜色。效果图如下：

 

第一种鼠标点击行颜色改变效果

前台代码是：

只要为DataGrid添加一个属性：

 

就可以了

后台代码是：

    private void dgContactType_ItemCommand(object source, System.Web.UI.WebControls.DataGridCommandEventArgs e)

        {

            this.dgContactType.SelectedIndex=e.Item.ItemIndex;//关键是这句，这几天就是没有注意这句而没达到那种效果，大家可以试试。

        }

第二种鼠标移动时行颜色改变效果

前台代码不需要特别设，后台代码是：

private void dgContactType_ItemDataBound(object sender, System.Web.UI.WebControls.DataGridItemEventArgs e)

        {

            e.Item.Attributes.Add("onclick","this.style.backgroundColor='#66ffcc';this.style.color='buttontext';this.style.cursor='default';");          

            e.Item.Attributes.Add("onmouseover","this.style.backgroundColor='#f0c6ff';this.style.color='buttontext';this.style.cursor='default';");

            e.Item.Attributes.Add("onmouseout","this.style.backgroundColor='';this.style.color='';");

        }

      主要是为每项添加了个鼠标在上方和移走后的事件。具体的大家去试试吧。

 

 

                      **..GridView鼠标经过改变行颜色...**

 

    其实也DataGrid差不多,不同的是:GridView是要添加一个DataView1_RowDataBound(object sender, GridViewRowEventArgs e)事件,其中的代码与DataGrid中的代码一样!