用javascript/css实现GridView行背景色交替、鼠标划过行变色，点击行变色选中

用javascript/css实现GridView行背景色交替、鼠标划过行变色，点击行变色选中,标签：javascript视频教程,javascript教程下载,http://www.xuehuiba.com
                    else{
                        AllRows[i].onmouseout = function(){if(!this.selected)this.style.background = AlterColor;}
                    }
                }

                //如果指定了鼠标点击的背景色，则添加onclick事件
                //在事件响应中修改被点击行的选中状态
                if(SelectColor != ""){
                    AllRows[i].onclick = function(){
                        this.style.background = this.style.background==SelectColor?HoverColor:SelectColor;
                        this.selected = !this.selected;
                    }
                }
            }
        }
    </script>
</body>
</html>

BackgroundColor.aspx.cs
用于生成一堆用于测试的数据，不然前面的GridView里啥也没有，就看不出效果了

using System;
using System.Data;

public partial class _BackgroundColor:System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        //生成DataTable并添加10个列
        DataTable dt = new DataTable();
        for(int i = 0; i < 10; i++)
        {
            dt.Columns.Add();
        }

        //往DataTable里添加20行数据
        for(int i = 0; i < 20; i++)
        {
            dt.Rows.Add(0, 1, 2, 3, 4, 5, 6, 7, 8, 9);
        }

        //将DataTable绑定到GridView
        gvMeiMingZi.DataSource = dt;
        gvMeiMingZi.DataBind();
    }
}

上一页  [1] [2]