1 <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 利用单个复选款（checkbox）实现全选、反选的更多相关文章

  1. layui 复选框checkbox 实现全选全选

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. jQuery对复选框（checkbox)的全选，全不选，反选等的操作

    效果截图: HTML代码: <body><ul id="list"> <li><label><input type=" ...

  3. jquery checkbox 选中 全选 插件

    checkbox  选中 全选 在项目中经常用到,但是不同的程序员写出的东西各有差异,在此整合了jquery checkbox插件,用起来很方便,也总结了我们项目中通常会出现问题的地方,一行代码搞定. ...

  4. jquery中checkbox的全选与反选

    <!DOCTYPE html><html><head> <meta charset="utf-8" /> <title> ...

  5. jQuery checkbox的全选与反选

    1:checkbox的全选与反选 js 代码 $("#cbAll").click(function(){ if($("#cbAll").is(":ch ...

  6. 通过VBA实现checkbox的全选和反选

    checkbox的全选和反选可以通过VBA来控制,这种设计常见于一些交互式报表,代码如下: 1.分成两个IF判断 Private Sub CheckBox1_Click()  ‘checkbox为总控 ...

  7. asp.net中Repeater结合js实现checkbox的全选/全不选

    前台界面代码: <input name="CheckAll" type="checkbox" id="CheckAll" value= ...

  8. html checkbox 实现全选/取消全选

    html checkbox  实现全选/取消全选 <html> <body> <table border="1"> <tr> < ...

  9. checkbox 的全选与全不选

    checkbox 的全选与全不选 只需要调用 cekAll.check();方法,这个方法接收两个参数: 参数一: 全选按钮的 id 以字符串的形式写 参数二: 其他 checkbox 的 name ...

随机推荐

  1. bootstrap-响应式图片、辅助类样式

    响应式图片: <div class="container"> <!-- img-responsive 响应式图片 --> <div class=&qu ...

  2. 谈Objective-C Block的实现

    来源:http://blog.devtang.com/blog/2013/07/28/a-look-inside-blocks/ 前言 这里有关于block的5道测试题,建议你阅读本文之前先做一下测试 ...

  3. java程序内存使用

    一.内存使用示意图 二.java运行时数据区域 1.程序计数器: 当前线程所执行字节码的行号提示器. 2.java虚拟机栈: 线程私有,与线程生命周期相同,保存基本数据类型,如果线程所请求的栈深度大于 ...

  4. gc 日志格式

    对于 Parallel Scavenge + Parallel Old - 新生代:PSYoungGen - 老年代:ParOldGen - 永久代:PSPermGen 后面方括号内部的 " ...

  5. Eclipse CDT 代码高亮配置

    效果图如下: 配置生效方式: 找到CDT的workspace目录中如下文件 X:\workspace\.metadata\.plugins\org.eclipse.core.runtime\.sett ...

  6. ElasticSearch的 Query DSL 和 Filter DSL

    Elasticsearch支持很多查询方式,其中一种就是DSL,它是把请求写在JSON里面,然后进行相关的查询. Query DSL 与 Filter DSL DSL查询语言中存在两种:查询DSL(q ...

  7. bash 学习笔记

    shell:能够操作应用程序的接口就称为shell. Linux由C编写的． TAB键的使用 alias:设置别名

  8. startService()和bindService()区别

    1. 生命周期:startService()方式启动,Service是通过接受Intent并且会经历onCreate()和onStart().当用户在发出意图使之销毁时会经历onDestroy(),而 ...

  9. [转]使用 HttpClient 和 HtmlParser 实现简易爬虫

    http://www.ibm.com/developerworks/cn/opensource/os-cn-crawler/ http://blog.csdn.net/dancen/article/d ...

  10. JSON.stringify

    $(document).ready(function (){var things =[{ id:1, color:'yellow'},{ id:2, color:'blue'},{ id:3, col ...