可能有浏览器兼容性，注意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. 算法之排序Low B三人组

    有序区:有的地方的数据已经完全变得有顺序,我们把这部分区域的数据成为有序区无序区:有的地方的数据依旧无序,我们把这部分数据成为无序区时间复杂度:用来估计算法运行时间的一个式子(单位)空间复杂度:用来评 ...

  2. 流畅的python第十八章使用asyncio包处理并发

    对比一个简单的多线程程序和对应的 asyncio 版,说明多线程和异步任务之间的关系asyncio.Future 类与 concurrent.futures.Future 类之间的区别摒弃线程或进程, ...

  3. 深度增强学习--DDPG

    DDPG DDPG介绍2 ddpg输出的不是行为的概率, 而是具体的行为, 用于连续动作 (continuous action) 的预测 公式推导 推导 代码实现的gym的pendulum游戏,这个游 ...

  4. 转： iOS崩溃堆栈符号表使用与用途

    转:http://bugly.qq.com/blog/?p=119 iOS崩溃堆栈符号化,定位问题分分钟搞定! 2015.3.16 腾讯Bugly 微信分享   最近一段时间,在跟开发者沟通过程中,萝 ...

  5. [LeetCode][Java] Substring with Concatenation of All Words

    题目: You are given a string, s, and a list of words, words, that are all of the same length. Find all ...

  6. PHP #2003 - 服务器没有响应怎么办

    1 出现这个问题的时候,首先可以肯定Apache服务器没有问题,因为如果Apache服务器有问题,则根本登不上phpMyadmin,如果你能登上localhost则说明Apache服务器没问题. 2 ...

  7. webpack安装以及一些配置

    在用webpack之前... 或说没有实现组件化之前的web1.0时代! 最终迈向web2..0之后的时代! ===============华丽的分割线================== 安装步骤有 ...

  8. 使用gradle构建Android时 版本号versionName中嵌入git提交信息

    为什么要这么做   在应用开发的版本迭代过程中,通过版本号并不能快速定位到所对应的代码,导致在后面分析问题追溯对应版本的代码时比较麻烦.   如果代码是通过git来管理的,git的commit id等 ...

  9. [Android] SQLite数据库之增删改查基础操作

        在编程中常常会遇到数据库的操作,而Android系统内置了SQLite,它是一款轻型数据库,遵守事务ACID的关系型数据库管理系统,它占用的资源非常低,可以支持Windows/Linux/Un ...

  10. recess----1.第一个APP-helloRecess

    选择recess的理由很简单,这个架构看起来很轻量级,很简单.至少是写起应用来感觉不需要考虑太多和架构相关的东西.没有按作者给的过程一步步来,折腾了好久...在这里记录一下. 安装过程略,官网文档无压 ...