<script type="text/javascript">

 $(function(){

     //全选

     $("#CheckedAll").click(function(){

         $('[name=items]:checkbox').attr("checked", this.checked );

     });

     $('[name=items]:checkbox').click(function(){

         //定义一个临时变量，避免重复使用同一个选择器选择页面中的元素，提升程序效率。

         var $tmp=$('[name=items]:checkbox');

         //用filter方法筛选出选中的复选框。并直接给CheckedAll赋值。

         $('#CheckedAll').attr('checked', $tmp.length==$tmp.filter(':checked').length);

     });

     //输出值

     $("#send").click(function(){

        var str="你选中的是：\r\n";

        $('[name=items]:checkbox:checked').each(function(){

            str+=$(this).val()+"\r\n";

        })

        alert(str);

     });

  });

  </script>

</head>

<body>

<form method="post" action="">

    <b>你爱好的运动是?</b><br/>

    <input type="checkbox" id="CheckedAll" />全选/全不选<br/>

    <input type="checkbox" name="items" value="足球"/>足球

    <input type="checkbox" name="items" value="篮球"/>篮球

    <input type="checkbox" name="items" value="羽毛球"/>羽毛球

    <input type="checkbox" name="items" value="乒乓球"/>乒乓球<br/>

    <input type="button" id="send" value="提　交"/>

</form>

</body>

jQuery 复选框全选反选的更多相关文章

  1. jQuery 复选框全选/取消全选/反选

    jQuery实现的复选框全选/取消全选/反选及获得选择的值. 完整代码: <!DOCTYPE html> <html> <head> <script type ...

  2. jQuery 前端复选框 全选 反选 下拉菜单联动

    jQuery 页面中复选框全选.反选.下拉联动(级联) <!DOCTYPE html> <html lang="en"> <head> < ...

  3. Jquery表格变色 复选框全选，反选

    /*jquery静态表格变色*/ $(".tr2").mouseover(function(){ $(this).css("background"," ...

  4. jQuery实现复选框 全选、反选、全不选

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <hea ...

  5. jQuery 实现复选框全选、反选及获取选中的值

    实现复选框全选,反选及获取选中的值: 代码如下: <!doctype html> <html lang="en"> <head> <met ...

  6. 复选框全选、全不选和反选的效果实现VIEW:1592

    <html> <head> <meta http-equiv="Content-Type" content="text/html; char ...

  7. html+css+js实现复选框全选与反选

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

  8. js 判断 复选框全选、全不选、反选、必选一个

    一个挺 使用的 js 代码片段,  判断  复选框全选.全不选.反选.必选一个 记录下, 搬来的 思路: 修改数据的 选中与否状态, 拿到所有的输入框,看是否有选中的状态 <html> & ...

  9. jQuery中的几个案例：隔行变色、复选框全选和全不选

    1 表格隔行变色 1 技术分析: 1 )基本过滤选择器: odd: even: 2 )jq添加和移除样式: addClass(); removeClass(); 2 代码实现 <script s ...

  10. vue+vant-UI框架写的购物车的复选框全选和反选

    购物车页面的设计图 商品的列表 代码: <ul v-if="shoppingListData.rows.length"> <li v-for="(ite ...

随机推荐

  1. APIO2015

    还没有写完APIO2015的题目,打算今天写一写. T1: 按位DP,DP时要保证已确定的位为0. 前4组设f[n][k]表示把前n个分成k组是否合法. 最后一组设g[n]表示把前n个最少分为多少组才 ...

  2. COJ 拯救瑞恩

    试题描述 在n行n列的字符方阵中I表示“我”最初所在位置,R是大兵瑞恩所在位置.4<n<11.“我”从当前位置可以向上.或下.或左.或右移动一格,只要新点无障碍且未出界.标有“.”的位置可 ...

  3. SQL Server事务的隔离级别

    SQL Server事务的隔离级别 ########## 数据库中数据的一致性 ########## 针对并发事务出现的数据不一致性,提出了4个级别的解决方法:  隔离级别  第一类丢失更新  脏读 ...

  4. Configuration of OpenCV2.1.0 with VS2010

    Add in the system Path: C:\Program Files (x86)\OpenCV-2.1.0\build\bin\Debug Project->Project Prop ...

  5. 1.Java为什么能跨平台运行？请简述原理。

    使用不同操作系统的JVM(JAVA虚拟机)解释运行编译好的字节码文件(.class)

  6. svn服务器配置

    源代码版本维护 官方网站:http://subversion.apache.org/ Windows客户端 TortoiseSVN:http://tortoisesvn.net/ 常见的版本控制软件 ...

  7. thinkphp中M（）和D（）的理解

    在tp框架中基于MVC设计模式中的model文件夹下,处理数据时会创建和表相关的模型类文件.在控制器中需要使用时需要实例化模型类对象,写语句 1.$a = new GoodsModel(); 这是基于 ...

  8. Wilddog - 野狗统计

    根据业务需求提出的统计代码. <!DOCTYPE HTML> <html lang="en-US"> <head> <meta chars ...

  9. diff和patch配合使用（转载备用）

    Linux下diff与patch命令的配合使用 在Linux下,diff与patch命令配合使用可以进行简单的代码维护工作. [A] diffdiff命令用于比较文件的差异,可以用于制作patch文件 ...

  10. 安装Bind过程中提示丢失MSVCR110.dll的解决办法

    前几天在线安装Visual Studio 2012 Update 3,由于在线安装需要不断下载安装文件,时间很长,后来等不下去,就取消了,不幸的是VS启动不了了,弹出“devenv.exe – 系统错 ...