jquery全选按钮实现

<html>

       <head>

              <title>checkbox check all test!</title>

              <script type="text/javascript" src="jquery.js"></script>

             

              <script type="text/javascript">

                     <!--

                            function checkBoxAll(allBoxId,childBoxName) {

                                   var allBox = $("#" + allBoxId);

                                   var childBox = $("input[@name='" + childBoxName + "']");

                                  

                                   allBox.click(function(){

                                         if($(this).attr("checked") == true){

                                               childBox.each(function(){

                                                     $(this).attr("checked",true);

                                               });

                                         }else{

                                               childBox.each(function(){

                                                     $(this).attr("checked",false);

                                               });

                                         }

                                  });

                                  childBox.each(function() {

                                         $(this).click(function() {

                                                for(var i = 0; i < childBox.length; i++) {

                                                       if(!$(childBox[i]).attr("checked")) {

                                                              allBox.attr("checked",false);

                                                              break;

                                                       }

                                                       allBox.attr("checked",true);

                                                }

                                         });

                                  });

                            }

                           

                            $(document).ready(function() {

                                   checkBoxAll('allCheck1','allCheck1Child');

                                   checkBoxAll('allCheck2','allCheck2Child');

                            });

                     //-->

              </script>

       </head>

      

       <body>

                     <input type="checkbox" id="allCheck1" /> 全选<br />

                    

                     </span><input type="checkbox" name="allCheck1Child" />

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

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

                    

                     <div style="height:10px;"></div>

                    

                     <input type="checkbox" id="allCheck2" /> 全选二 <br />

                    

                     <input type="checkbox" name="allCheck2Child" /> 11111

                     <input type="checkbox" name="allCheck2Child" /> 22222

                     <input type="checkbox" name="allCheck2Child" /> 33333

       </body>

</html>

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值