checkbox全选jquery

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>selectAll</title>
    <style type="text/css">
       table {
            border: 1px solid red;
            border-collapse:collapse;
            width:300px;
            margin :auto;
            text-align:center;

        }
    </style>
    <script src="js/jquery-1.7.1.js"></script>

    <script type="text/javascript">
        $(function () {
            $(".all").click(function () {
                if ($(".all").attr("checked")) {//全选

                    $(".cc").attr("checked", true);
                }
                else {//取消全选
                    $(".cc").removeAttr("checked");
                }

            })

            $(".cc").click(function () {
                SelectAll();
            })

        })

        function SelectAll() {

            if (!$(".cc").attr("checked")) {//未选中
                $(".all").attr("checked",false)
            }
            else {//全部选中
                $(".all").attr("checked", true)
            }

        }
    </script>
</head>
<body>
    <table id="tb" border="1">
        <tr>
            <td>序列</td>
        </tr>
         <tr>
            <td>
                <input type="checkbox" class="cc"/></td>    </tr>
              <tr>
            <td><input type="checkbox" class="cc"/></td>

        </tr>
         <tr>
            <td><input type="checkbox" class="cc"/></td>

        </tr>
         <tr>
            <td><input type="checkbox" class="cc"/></td>

        </tr>
         <tr>
            <td><input type="checkbox" class="all"  />all</td>

        </tr>
    </table>
</body>
</html>
时间: 2024-10-05 20:28:29

checkbox全选jquery的相关文章

利用jQuery实现CheckBox全选/全不选/反选

转自: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

jQuery设置checkbox全选(区别jQuery版本)

jQuery设置checkbox全选在网上有各种文章介绍,但是为什么在我们用他们的代码的时候就没有效果呢? 如果你的代码一点错误都没有,先不要急着怀疑人家代码的正确性,也许只是人家跟你用的jQuery版本不同而已. jQuery很多版本都会对一些小的功能做一些改进,比如checkbox的选中. jQuery对checkbox改动的界线版本 jquery1.9.1. jquery1.9.1之前,全选是这样的: $('#checkbox').attr('checked',true) $('#chec

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

最近在公司做了一个小项目,其中有一个全选和取消全选的这么一个模块,搞了半天找不到一种最佳的解决方案!后来通过各种努力找到了一种简洁高效的解决办法,这里想和大家分享一下.有问题的话,还望各路大神指导一二. html代码如下: <fieldset data-role="controlgroup">  <label><input type="checkbox" name="boxes" id="select_al

jQuery实现CheckBox全选、全不选

1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head runat="server"> 4 &

jquery checkbox 全选 不要用attr要用 prop

最近的项目要用到checkbox全选功能,然而使用 attr时总是出现第二次点击时checkbox不变化.后来搜索后,发现在jquery1.6以后已经不用attr处理布尔值的属性了. 查看文档发现 properties就是浏览器用来记录当前值的东西.正常情况下,properties反映它们相应的attributes(如果存在的话).但这并不是boolean attriubutes的情况.当用户点击一个checkbox元素或选中一个select元素的一个option时,boolean proper

JQuery 判断checkbox是否选中,checkbox全选,获取checkbox选中值

<!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> <meta http-equiv="Content-

jquery checkbox全选,全不选,反选方法,jquery checkbox全选只能操作一次

jquery checkbox全选,全不选,反选方法, jquery checkbox全选只能操作一次, jquery checkbox全选只有第一次成功 Js代码  下载 /** * 全选 * 对于Jquey1.7.2+版本,使用attr会造成只能操作一次. * 对于HTML元素本身就带有的固有属性,在处理时,使用prop方法. * 对于HTML元素我们自己自定义的DOM属性,在处理时,使用attr方法. * @param checkName */ function checkAll(chec

jquery中checkbox全选失效的解决方法

这篇文章主要介绍了jquery中checkbox全选失效的解决方法,需要的朋友可以参考下 如果你使用jQuery 1.6 ,代码if ( $(elem).attr(“checked”) ),将获得一个属性(attribute) ,它不改变该复选框被选中和选中.它只是用来存储默认或选中属性的初始值.为了保持向后兼容,.attr() 方法从 jQuery 1.6.1+ 开始除了返回属性值外,还会更新 property 属性,因此 boolean attribute(布尔属性)不需要通过 .prop(

jQuery模糊匹配checkbox全选 value实现checkbox部分或全部全选

本文章总结jQuery实现checkbox三种情况的全选功能 第一种:等值全选,也称name的等值全选,通过checkbox的名称name实现. 第二种:模糊全选,也称id模糊全选,通过checkbox的id或value值实现. 第三种:值范围全选,也称value值范围全选,通过checkbox的value值实现,或者截取id数字后缀范围判断实现. 等值全选 在工作中经常会用到checkbox的全选功能,平时大家用得最多的全选和反选是第一种,一般都是基于全部名称相同的checkbox进行实现,这