jquery 实现邮箱的全选/全不选全选与全不选功能

原创

mb64a401e9f23d4 2023-07-09 00:18:07 博主文章分类：jQuery ©著作权

文章标签 javascript ViewUI html 全不选 HTML 文章分类 HarmonyOS 后端开发

©著作权归作者所有：来自51CTO博客作者mb64a401e9f23d4的原创作品，请联系作者获取转载授权，否则将追究法律责任

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title> New Document </title>
     <script src="c:\jquery.js""></script>
  </head>
       <script>
//                      全选/全不选    
                       $(function(){
                      //  alert(true&&false);
                        $("#checkboxAll").click(function(){
                                $("[name=items]:checkbox").attr("checked",this.checked)
                        });

//                      反选                        
                        $("#checkRev").click(function(){
                                $("[name=items]:checkbox").each(function(){
                                    this.checked=!this.checked;
                                });
                        });    
//                      绑定
                        $("[name=items]:checkbox").click(function(){
                               var flag=true;
                                $("[name=items]:checkbox").each(function(){
                                    if(!this.checked){
                                        flag=false;
                                        return false;
                                        
                                    }                                                                
                                });
                                $("#checkboxAll").attr("checked",flag);
                        });
                 })
       </script>
   <body>
       你喜欢的水果是?
       <input type="checkbox" id="checkboxAll">全选/全不选</input><br>
    
       <input type="checkbox" name="items">苹果</input>
       <input type="checkbox" name="items">香蕉</input>
       <input type="checkbox" name="items">西瓜</input>
       <input type="checkbox" name="items">葡萄</input><br>
       <input type="button" id="checkRev" value="反选"></input><br>
   </body>
</html>