利用javascript实现复选框的全选功能

原创 2012年03月21日 11:09:18

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm43.aspx.cs" Inherits="ASP.NETWebControlDaQuan.WebForm43" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script language="javascript" type="text/javascript">
        //利用javascript实现复选框的全选功能
        function allSelect() {
            var v1 = document.getElementById("selectAll");
            var v2 = document.getElementsByName("select");
            for (var i = 0; i < v2.length; i++) {
                v2[i].checked = v1.checked;
            }
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <asp:GridView ID="gv" runat="server" DataSourceID="studentDataSource" AllowPaging="true">
                <Columns>
                    <asp:TemplateField>
                        <HeaderTemplate>
                            <input type="checkbox" id="selectAll" onclick="allSelect()" />
                        </HeaderTemplate>
                        <ItemTemplate>
                            <input type="checkbox" name="select" />
                        </ItemTemplate>
                    </asp:TemplateField>
                </Columns>
            </asp:GridView>
            <asp:SqlDataSource ID="studentDataSource" runat="server" ConnectionString="server=(local);database=db_students;integrated security=true" SelectCommand="select top 100 * from CwwTest">
            </asp:SqlDataSource>
        </div>
    </form>
</body>
</html>

js实现简单的checkbox全选和取消全选效果

js点击checkbox实现全选效果 function DoCheck() { var ch=document.getElementsByName("choose"); ...
  • sunwei3160
  • sunwei3160
  • 2014年08月12日 14:37
  • 16908

jsp页面中实现复选框全选和反选、选中删除功能

jsp中表单页面 /DelectServlet" method=post> 全选/反选 ...
  • u012777182
  • u012777182
  • 2014年06月25日 10:37
  • 5347

jQuery实现Checkbox全选功能

jQuery实现勾选CheckAll时选中某一类全部的checkbox;当这一类中的checkbox有一个没有被选中,则CheckAll就不应该被勾选;如果所有的checkbox被选中,则CheckA...
  • u012739535
  • u012739535
  • 2015年07月13日 22:35
  • 2265

用原生js实现复选框选择以及全选非全选功能 (待看)

CheckBox控件就是我们一般所说的复选框,通常用于某选项的打开或关闭。大多数应用程序的“设置”对话框内均有此控件。我们看到的可以打勾的就是CheckBox。   该控件表明一个特定的状态(即选项...
  • melody_day
  • melody_day
  • 2016年12月08日 16:31
  • 1772

java实现复选框的全选和反选功能

在web项目开发中,全选和反选是最常用,也是最基础的技术: 现在让小朋为大家来总结几种小实例: Jquery中: 第一种方法: $("#checkid").click(function(){ ...
  • clare504
  • clare504
  • 2013年09月22日 15:13
  • 5356

javascript实现复选框全选功能

--> function choseAll() { var all  = document.getElementById("all"); var ch = document.getEleme...
  • llllpppp4444
  • llllpppp4444
  • 2015年12月07日 22:24
  • 200

使用js实现checkbox的全选与反选功能二

效果图如下:
  • Geek_ymv
  • Geek_ymv
  • 2014年10月23日 09:45
  • 708

JS实现复选框的全选和批量删除功能(php后端)

JS实现复选框的全选和批量删除功能(php后端)
  • zhangguoliang12309
  • zhangguoliang12309
  • 2017年12月13日 16:51
  • 139

Html+JS实现全选与非全选操作

Html+JS;全选与非全选
  • qingxue14
  • qingxue14
  • 2017年08月01日 15:13
  • 756

javasctipt实现-复选框全选/反选的实现

以下是用原生js实现的复选框全选/反选的实现 选中checkbox的时候,实现全选的效果,并且样式发生改变。 代码最简洁,js行为优化版,复制粘贴即可使用。 ** 复选框...
  • garvisjack
  • garvisjack
  • 2017年01月30日 21:25
  • 736
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:利用javascript实现复选框的全选功能
举报原因:
原因补充:

(最多只允许输入30个字)