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

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

<head>

    <title></title>

</head>

<body>

    <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.0.js" type="text/javascript">

    </script>

    <script>

    $(document).ready(function () {

    var xsChk = 'px';//定义的样式

var xsChkAll = "input[type='checkbox'][class='" + xsChk + "'][name]";//所有定义此样式的checkbox

$(xsChkAll).each(function () {

    var name = $(this).prop("name");

    name = "input[type='checkbox'][class!='" + xsChk + "'][name='" + name + "']";//此全选框下面的子checkbox

    $(this).on('click', function () {

        $(name).prop("checked", $(this)[0].checked);

    })

    var xschk = $(this);

    $(name).on('click', function () {

        var IAll = $(name).length; //此子项目下所有checkbox的个数

        var IChk = $(name + ":checked").length; //此子项目下所有勾选checkbox的个数

        var isAllChecked = true; //是否是全选

        if (IAll != IChk) {

            isAllChecked = false;

        }

        $(xschk).prop("checked", isAllChecked);

    });

});

});

    </script>

        <legend>全选one</legend>

        <input type="checkbox" class="xsChk" name="chk" />

        全選

        <input type="checkbox" name="chk" />

        1<br />

        <input type="checkbox" name="chk" />

        2<br />

        <input type="checkbox" name="chk" />

        3<br />

        <input type="checkbox" name="chk" />

        4<br />

        <legend>全选two</legend>

        <input type="checkbox" class="xsChk" name="chk1" />

        全選2

        <input type="checkbox" name="chk1" />

        11<br />

        <input type="checkbox" name="chk1" />

        22<br />

        <input type="checkbox" name="chk1" />

        33<br />

        <input type="checkbox" name="chk1" />

        44<br />

</body>

</html>

本文修改于博客园里一个案例，现在找不到这遍文章的地址，特此说明！

Jquery中对checkbox的各种“全选”或者“取消”功能实现（特别注意1.6+的一定不能使用attr来取属性了！用prop！）的更多相关文章

  1. checkbox全选和取消功能

    这是开发中常见的小功能,想当初我也曾对于attr和prop的不了解踩过坑. 前端工作中,常常会使用到select复选框,select复选框有一个属性checked,当使用js或者jquery控制这个属 ...

  2. 如何在repeater中找到checkbox并实现全选删除

    checkbox使用客户端控件,且给repeater里边的checkbox添加ruanat＝server属性表头中的chkTotal的属性一定不要加此属性....然后 全选的javascript代码  ...

  3. 使用js实现复选框的全选、取消功能

    id为all的想设置全选的那个框的id,name为checkname[]的是每个小复选框: 第一种: <script> function checkAll() { var all=docu ...

  4. 全选、取消、2级 checkbox的选中切换

    需求:点击父级checkbox的时候,子级出现全选或全取消:点击子级时,如:子级都是在未选中时,点击某一个子级,则父级选中:如:子级中只有一个选中状态(其他子级都是未选中),点击该子级,则父级也改为未 ...

  5. js实现checkbox组 全选和取消全选

    做后台管理程序时,用到一个checkbox组的全选和取消全选的功能, 主要是逻辑上的坑,理清后大概是: 1.全选点击后,小弟1~4都要选上,点击取消,小弟们也要取消 2.只要有一个小弟取消时,全选要取 ...

  6. jquery操作checkbox方法（全选、全不选、至少选择一个、选择值/文本）

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

  7. Jquery 利用单个复选款（checkbox）实现全选、反选

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

  8. jQuery --checkbox全选和取消全选简洁高效的解决办法

    最近在公司做了一个小项目,其中有一个全选和取消全选的这么一个模块,搞了半天找不到一种最佳的解决方案!后来通过各种努力找到了一种简洁高效的解决办法,这里想和大家分享一下.有问题的话,还望各路大神指导一二 ...

  9. JS实现全选与取消 Jquery判断checkbox是否被选中

    1.JS实现checkbox全选与取消 <body> <input type="checkbox" name="select_all"/> ...

随机推荐

  1. bzoj 3573: [Hnoi2014]米特运输

    3573: [Hnoi2014]米特运输 Description 米特是D星球上一种非常神秘的物质,蕴含着巨大的能量.在以米特为主要能源的D星上,这种米特能源的运输和储存一直是一个大问题.    D星 ...

  2. zoj 2966 Build The Electric System 最小生成树

    Escape Time II Time Limit: 20 Sec  Memory Limit: 256 MB 题目连接 http://acm.zju.edu.cn/onlinejudge/showP ...

  3. FLV视频在IIS6.0下不能播放 处理的方法

    FLV视频在IIS6.0下不能播放 Flash视频由于其较高的压缩率和优越的下载速度,前景普遍看好,同时也为Flash课件增色不少.然而,在FLV视频播放中,却有两个头痛的问题    一.FLV视频在 ...

  4. Newtonsoft.Json序列化和反序列

    这里下载:http://www.newtonsoft.com/products/json/安装:   1.解压下载文件,得到Newtonsoft.Json.dll   2.在项目中添加引用.. 序列化 ...

  5. IOS开发自定义CheckBox控件

    IOS本身没有系统的CheckBox组件,但是实际开发中会经常用到,所以专门写了一个CheckBox控件,直接上代码 效果图: UICheckBoxButton.h文件如下: #import #imp ...

  6. JLInk 各种版本图片收集

    所有图片来自网络, 版权归原始所有者拥有. JLink V5 JLink V6 JLink V7 JLink V8 JLink V9 JLink Ultra JLink Pro

  7. IDA resources - Script, Plugin, Project, Book, Tutorial

    https://www.hex-rays.com/forum/viewtopic.php?f=6&t=3322 List of scripts:http://www.openrce.org/d ...

  8. SQLSERVER里面RR隔离级别没有GAP锁

    http://www.cnblogs.com/MYSQLZOUQI/articles/3862721.html

  9. C#各种结束进程的方法详细介绍

    Process类的CloseMainWindow, Kill, Close Process.CloseMainWindow是GUI程序的最友好结束方式,从名字上就可以看出来它是通过结束主窗体,相当于用 ...

  10. android 各种颜色值 colors.xml

    <?xml version="1.0" encoding="utf-8" ?> <resources> <color name=& ...