ASP.NET中多选效果与光棒效果（实现代码）

1） 多选效果

多选效果完全可以通过脚本进行实现。我们知道，多选的控件最终生成一个input的HTML标签，它的类型是checkbox。由于这个页面中只有一组复选框，所以实现起来也比较方便：我们可以遍历所有的input标签，对比其type属性是不是checkbox，如果是checkbox，就给它设置相应的选中状态就行了。

 

代码如下：

 

<script language="javascript">

  function GetAllCheckBox(CheckAll)       //以“全选”前面的复选框对象做参数

{

   var items = document.getElementByTagName("input");  //获得所有input对象的列表，并遍历该对象

   for(i=0; i<items.length; i++)

    {

         if(items[i].type ==  "checkbox")   //判断遍历input对象的列表中的对象是否为checkbox类型

          {

              items[i].checked = CheckAll.checked;

          }

     }

}

 

 

 

2)光棒效果

实现光棒效果其实也不算难，它就是改变了一下某行的背景色而已。在样式表中backgroundColor属性用于设置对象的背景色。使用JavaScript时，我们可以通过this.style.backgroundColor来获得或者设置某对象的背景色。

 

我们只需要给需要高亮显示的行添加两个时间onmouseover和onmouseout。onmouseover在鼠标移动到对象所在区域时执行，而onmouseout在鼠标离开对象所在区域时执行。我们可以在这两个事件上编写代码，实现高亮效果。那么我们在表格中的每一行添加这两个事件就可以了。但表格中的行是绑定生成的，也许你还不知道该如何在这些生成的行上添加事件呢。

 

在GridView中，有一个OnRowDataBound行绑定事件。我们可以在绑定行的时候，设置当前行的鼠标移动效果，代码如下：

 

protected void gvBooks_RowDataBound(object sender, GridViewRowEventArgs e)

{

      if(e.Row.RowType == DataControlRowType.DataRow)

       {

            e.Row.Attributes.Add("onmouseover","currentcolor=this.style.backgroundColor;this.style.backgroundColor ='#6699ff'");

            e.Row.Attributes.Add("onmouseout"this.style.backgroundColor =currentcolor);

       }

   }