转自:http://www.cnblogs.com/linjiqin/p/3148259.html

jQuery有些版本中实现CheckBox全选/全不选/反选会有bug,经测试jquery-1.3.1.js–>测试通过,jquery-1.5.1.js–>测试不通过。

实现CheckBox全选/全不选/反选代码如下:

<%@ page language="java" pageEncoding="UTF-8"%>
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
 <head>
  <title>复选框全选/全不选/反选</title>
  <meta http-equiv="pragma" content="no-cache">
  <meta http-equiv="cache-control" content="no-cache">
  <meta http-equiv="expires" content="0">
  <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
  <meta http-equiv="description" content="This is my page">
  <script type="text/javascript"
   src="<%=request.getContextPath()%>/js/jquery-1.3.1.js"></script>
  <script type="text/javascript"> 
  /**
   * 全选
   *
   * items 复选框的name
   */
  function allCkb(items){
     $('[name='+items+']:checkbox').attr("checked", true);
  }
     
  /**
   * 全不选
   *
   */
  function unAllCkb(){
     $('[type=checkbox]:checkbox').attr('checked', false);
  }
     
  /**
   * 反选
   *
   * items 复选框的name
   */
  function inverseCkb(items){
     $('[name='+items+']:checkbox').each(function(){
        //此处用jq写法颇显啰嗦。体现不出JQ飘逸的感觉。
     //$(this).attr("checked", !$(this).attr("checked"));
    
     //直接使用js原生代码,简单实用
     this.checked=!this.checked;
     });
  }
 
  </script>
 </head>
 
 <body>
       <input type='checkbox' name='ckb' value="0"/>白羊座
       <input type='checkbox' name='ckb' value="1"/>狮子座
       <input type='checkbox' name='ckb' value="2"/>水瓶座
       <input type='checkbox' name='ckb' value="3"/>射手座<br/>
       <input type="button" onclick="allCkb('ckb')" value="全 选"/>
    <input type="button" onclick="unAllCkb()" value="全不选"/>
    <input type="button" onclick="inverseCkb('ckb')" value="反 选"/>
 </body>
</html>

利用jQuery实现CheckBox全选/全不选/反选的更多相关文章

  1. jquery操作checkbox方法(全选、全不选、至少选择一个、选择值/文本)

    原文:http://blog.csdn.net/u014079773/article/details/52371382 在实际开发中我们经常操作checkbox,不仅仅要获得checkbox选中的值, ...

  2. jquery实现checkbox列表的全选不选

    html代码 <th><input type="checkbox" onclick="selectAll(this);" />全选/取消 ...

  3. 【jQuery】CheckBox使用attr全选无法正确显示

    今天编写JS脚本时,遇到如下的问题. 下面是源代码: <script src="../Scripts/jquery-2.1.3.js"></script> ...

  4. Jquery 利用单个复选款(checkbox)实现全选、反选

    1 <script type="text/javascript"> $(function(){ //全选 $("#CheckedAll").clic ...

  5. 解决jquery操作checkbox全选全不选无法勾选问题

    最近在学习中使用jquery操作checkbox,使用下面方法进行全选.反选:$("input[name='checkbox']").attr("checked" ...

  6. jquery实现checkbox全选和全部取消,以及获取值

    在后台管理中经常会遇到列表全选和取消的功能,如评论审核.申请等,用到的html标记就是checkbox.我用的是mysql数据库,代码如下: <!DOCTYPE html PUBLIC &quo ...

  7. jquery实现checkbox的全选

    <html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> < ...

  8. jQuery实现Checkbox中项目开发全选全不选的使用

    <html> <head> <meta charset="utf-8"> <title>Checkbox的练习</title& ...

  9. jQuery实现CheckBox全选、全不选

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

随机推荐

  1. RHEL6.4记录一次添加一块新分区的操作

    首先看了下挂载点及目录 fdisk /dev/sda [root@box ~]# fdisk /dev/sda WARNING: DOS-compatible mode is deprecated. ...

  2. HDU4870_Rating_双号从零单排_高斯消元求期望

    原题链接:http://acm.hdu.edu.cn/showproblem.php?pid=4870 原题: Rating Time Limit: 10000/5000 MS (Java/Other ...

  3. 【原创】angularjs1.3.0源码解析之scope

    Angular作用域 前言 之前我们探讨过Angular的执行流程,在一切准备工作就绪后(我是指所有directive和service都装载完毕),接下来其实就是编译dom(从指定的根节点开始遍历do ...

  4. 用firebug给firefox添加信任链接

    在前文“firefox查看微信公众平台的数据分析时就出现不信任链接怎么办?”我们使用了导入证书的方法添加信任链接,有网友反映说证书导入不成功,这里用另外一种方法来实现:用firebug给firefox ...

  5. Arbitrage(bellman_ford)

    Arbitrage Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 16652   Accepted: 7004 Descri ...

  6. 5款Linux最佳照片管理软件

    在谈到 Linux 中的应用程序时,对于不同的用户.不同的使用场景以及不同的使用习惯,在同一类应用当中,总会有多种软件可供选择和备选.就 Linux 中的照片管理软件来说,相信此前的 Google P ...

  7. javascript return false 详解

    在大多数情况下,为事件处理函数返回false,可以防止默认的事件行为.例如,默认情况下点击一个<a>元素,页面会跳转到该元素href属性指定的页. Return False 就相当于终止符 ...

  8. 二级域名session 共享方案

    二级域名session 共享方案   1.利用COOKIE存放session_id(); 实例: 域名一文件php代码: <?php session_start(); setcookie(&qu ...

  9. jquery取checkbox选中的值

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

  10. Mac 下 Chrome 浏览器 快捷键

    ⌘-Option-I 打开“开发人员工具”. ⌘-Option-J 打开“JavaScript 控制台”. ⌘-Option-U 打开当前网页的源代码. 转自: http://www.harbin-s ...