• 复选框全选实现方法


    <html>
        <head>
            <meta charset="utf-8" />
            <script type="text/javascript" src="jquery-1.7.1.min.js"></script>
            <script>
                $(document).ready(function(){
                    $("[name='allSel']").click(function(){
                        if($(this).is(':checked')){
                            $("[name='select']").attr('checked',true);
                        }else{
                            $("[name='select']").attr('checked',false);
                        }
                    })
                    $("[name='select']").click(function(){
                        var allSel = false;
                        $("[name='select']").each(function(){
                            if(!$(this).is(':checked')){
                                allSel = true;
                            }
                        })
                        if(allSel){
                            $("[name='allSel']").attr('checked',false);
                        }else{
                            $("[name='allSel']").attr('checked',true);
                        }
                    })
                });
            </script>
        </head>
        <body>
            <input type="checkbox" name="allSel" />全选
            <hr />
            <input type="checkbox" name="select" value="1"/>1</br>
            <input type="checkbox" name="select" value="2"/>2</br>
            <input type="checkbox" name="select" value="3"/>3</br>
            <input type="checkbox" name="select" value="4"/>4</br>
            <input type="checkbox" name="select" value="5"/>5</br>
        </body>
    </html>

    参考地址

    实际运用中出现一个BUG,

    function check(id,check) {
        if (check) {
            $("." + id).find("input[type='checkbox']").attr("checked", true);
        } else {
            $("." + id).find("input[type='checkbox']").attr("checked", false);
        }
    }

    第一遍勾选和取消是有效的,但是第二遍以后就没反应了,查看了属性,发现checked属性一直存在,但是没显示勾。就考虑移除checked属性看看。

    function check(id,check) {
        if (check) {
            $("." + id).find("input[type='checkbox']").attr("checked", true);
        } else {
            $("." + id).find("input[type='checkbox']").removeAttr("checked");
        }
    }

    这次看到checked属性勾上有了,取消就没了,可是问题还是没解决,还是第二遍以后就没反应了。看Jquery手册上说1.6以下版本在IE6使用JQuery的removeAttr方法删除disabled是无效的。解决的方法就是使用$("XX").prop("disabled",false);课时我都用1.10的版本了,不管那么多了,死马当活马医就用这个方法试试。

    function check(id,check) {
        if (check) {
            $("." + id).find("input[type='checkbox']").prop("checked", true);
        } else {
            $("." + id).find("input[type='checkbox']").removeAttr("checked");
        }
    }

    写成这样,问题解决

  • 相关阅读:
    Windows 2003 服务器 关闭IIS中FTP匿名访问
    Linux 服务器 关闭FTP匿名访问
    CentOS 7 配置本地 YUM源
    Linux中使用MegaCli工具查看、管理Raid卡信息
    Linux 6 本地网络配置方法
    勒索病毒,华为/H3C三层交换机/路由器用ACL访问控制实现端口禁用
    Linux RedHat7.0_64位系统中安装Oracle_11g_R2
    Linux 7 重置root密码
    windows 系统防火墙 添加端口号方法
    SpringBoot 2.x (12):整合Elasticsearch
  • 原文地址:https://www.cnblogs.com/yourself/p/9184138.html
Copyright © 2020-2023  润新知