可能有浏览器兼容性，注意html里的checked是一个属性，存在就默认选中。

 <!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>Document</title>

     <script src='jquery.js'></script>

 </head>

 <body>

     <p><input type="checkbox">篮球</p>

     <p><input type="checkbox">唱歌</p>

     <p><input type="checkbox">旅游</p>

     <p><input type="checkbox">美食</p>

     <input type="button" value="全选" name="all">

     <input type="button" value="全不选" name="none">

     <input type="button" value="反选" name="reverse">

 </body>

 <script>

     //这个地方在谷歌浏览器有问题，点全不选后再点全选没有效果，ie里面没问题。

     //checked在html里面是一个属性，不管checked=''里面是啥，都会默认选中。

     $('[name=all]').click(function(){

         $('p input').attr({'checked':true});

     });

     $('[name=none]').click(function(){

         $('p input').removeAttr('checked',false);

     });

     $('[name=reverse]').click(function(){

         $('p input').each(function(){

             //这里使用js的this对象，checked是一个属性

             this.checked = !this.checked;

         });

     });

 </script>

 </html>

修改后，chrome也可以用了：

 <script>

     //这个地方在谷歌浏览器有问题，点全不选后再点全选没有效果，ie里面没问题。

     //checked在html里面是一个属性，不管checked=''里面是啥，都会默认选中。

     $('[name=all]').click(function(){

         //jqery负责遍历，js的this改变checked的true和false

         $('p input').each(function(){

             this.checked = true;

         });

     });

     $('[name=none]').click(function(){

         //同上

         $('p input').each(function(){

             this.checked = false;

         });

     });

     $('[name=reverse]').click(function(){

         $('p input').each(function(){

             //这里使用js的this对象，checked是一个属性

             // alert(!this.checked);

             this.checked = !this.checked;

         });

     });

 </script>

 </html>

再次改进，使用prop()方法，专门修改固有属性，比如checked：

 <script>

     $('[name=all]').click(function(){

         $(':checkbox').prop('checked',true);

     });

     $('[name=none]').click(function(){

         $(':checkbox').prop('checked',false);

     });

     $('[name=anti]').click(function(){

         $(':checkbox').each(function(){

             var isTrue = !$(this).prop('checked');

             // alert(isTrue);

             $(this).prop('checked',isTrue);

         });

     });

 </script>

Jquery学习笔记（4）--checkbox全选反选的更多相关文章

  1. jquery、js操作checkbox全选反选

    全选反选checkbox在实际应用中比较常见,本文有个不错的示例,大家可以参考下 操作checkbox,全选反选//全选 function checkAll() { $('input[name=&qu ...

  2. jquery数组之存放checkbox全选值示例代码

    使用jquery数组可以存放checkbox全选值,下面有个不错的示例,感兴趣的朋友可以参考下. 复制代码代码如下: <input type="checkbox" id=&q ...

  3. 表单javascript checkbox全选 反选 全不选

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

  4. 关于Winform下DataGridView中实现checkbox全选反选、同步列表项的处理

    近期接手一个winform 项目,虽然之前有.net 的经验,但是对一些控件的用法还不是很熟悉. 这段时间将会记录一些在工作中遇到的坎坷以及对应的解决办法,写出来与大家分享并希望大神提出更好解决方法来 ...

  5. jQuery使用prop设置checkbox全选、反选

    $(function(){     var checkbox = $("input[type='checkbox']");     //全选     $('#select-all' ...

  6. jQuery实现checkbox全选反选及删除等操作

    1.list.html 说明:用checkbox数组Check[]存放每一行的ID值 <div id="con"> <table width="100% ...

  7. JS学习笔记 - fgm练习 2-12- 全选反选 判断CheckBox是否选中 &&运算符

    练习地址:http://www.fgm.cc/learn/lesson2/12.html 总结: 1.  && 运算符,从左向右依次执行,如果遇到 false,就不再继续执行后面的语句 ...

  8. jquery checkbox 全选反选代码只能执行一遍，第二次就失败

    遇到问题背景: 在写到购物车的全选交互的时候,商品选中的状态只有在第一次的时候可以,第二次就无法选中:(代码如下) $(".chooseall").click(function() ...

  9. checkbox 全选反选实现全代码

    //跳转到指定action function validateForm(url){ if($("#form").form('validate')){ var x=document. ...

随机推荐

  1. [转]SSIS cannot convert between unicode and non-unicode string

    本文转自:http://www.mssqltips.com/sqlservertip/1393/import-excel-unicode-data-with-sql-server-integratio ...

  2. delphi 查看编译版本

    对照表: http://docwiki.embarcadero.com/RADStudio/Tokyo/en/Compiler_Versions procedure TForm1.Button1Cli ...

  3. java 获取进程的processId

    package us.mine.demo.jvm.util; import java.lang.management.ManagementFactory; import java.lang.manag ...

  4. JQuery的get、post和ajax方法的使用

    在JQuery中可以使用get,post和ajax方法给服务器端传递数据 get方法的使用(customForGet.js文件): function verify(){ //1.获取文本框的数据 // ...

  5. 标准C++ I/O库 迭代器让数据自由流动 V8

    IO库的组成 三种流 C++的IO库以流对象为实体.主要有三种流: (1)标准输入输出流 (2)文件输入输出流 (3)字符串输入输出流 流迭代器 输入输出流迭代器 instream_iterator& ...

  6. winfrom 底层类 验证码

    效果图: watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvdTAxMzgxNjcwOQ==/font/5a6L5L2T/fontsize/400/fill/I ...

  7. 求字符串A与字符串B的最长公共字符串（JAVA）

    思路:引入一个矩阵的思想,把字符串A(长度为m)当成矩阵的行,把字符串B(长度为n)当矩阵的列.这样就构成一个m*n的矩阵.若该矩阵的节点相应的字符同样,即m[i]=n[j]时.该节点值为1:当前字符 ...

  8. 算法笔记_097:蓝桥杯练习 算法提高 P1001（Java）

    目录 1 问题描述 2 解决方案   1 问题描述 当两个比较大的整数相乘时,可能会出现数据溢出的情形.为避免溢出,可以采用字符串的方法来实现两个大数之间的乘法.具体来说,首先以字符串的形式输入两个整 ...

  9. C Python类型互换

    从Python到C的转换用PyArg_Parse*系列函数,int PyArg_ParseTuple():把Python传过来的参数转为C:int PyArg_ParseTupleAndKeyword ...

  10. 机器学习系列(8)_读《Nature》论文，看AlphaGo养成

    作者:viewmode=contents">龙心尘 && viewmode=contents">寒小阳 时间:2016年3月. 出处:http://bl ...