zoukankan      html  css  js  c++  java
  • jquery 全选 全不选

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html>
     <head>
      <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
      <title>jQuery 全选 全不选</title>
         <script src="Scripts/jquery-1.4.4.min.js" type="text/javascript"></script>
         <script type="text/javascript">
             $(function () {
                 $("#chkAll").click(function () {
                     $("input[name='chk']").attr("checked", $(this).attr("checked"));   //注意
                 });

                 $("input[name='chk']").each(function () {
                     $(this).click(function () {
                         if ($("input[name='chk']:checked").length == $("input[name='chk']").length) {
                             $("#chkAll").attr("checked", true)     //当元素全部选择后,控制全部的checkbox也处于选定状态
                         } else {
                             $("#chkAll").attr("checked", false);    //只要有一个没有选择控制全选的checkbox是不会checked的
                         }
                     })

                 });
             });      
         </script>
     </head>
     <body>
      <input type="checkbox" id="checkbox1" name="chk" ><label for="checkbox1">aaaaaa</label><br>
      <input type="checkbox" id="checkbox2" name="chk" ><label for="checkbox2">bbbbbb</label><br>
      <input type="checkbox" id="checkbox3" name="chk" ><label for="checkbox3">cccccc</label><br>
      <input type="checkbox" id="checkbox4" name="chk" ><label for="checkbox4">dddddd</label><br>
      <input type="checkbox" id="checkbox5" name="chk" ><label for="checkbox5">eeeeee</label><br><br>
      <input type="checkbox" id="chkAll" name="chkAll" /><label for="chkAll">全选</label>
     </body>
    </html>

  • 相关阅读:
    关于jQuery动态多次绑定的问题及解决
    零基础英文盲打的建议
    29道Java简答题
    Redis分布式锁的实现(纯文字)
    小程序三级联动(动态获取数据)
    sql中按in中的ID进行排序输出
    layui中对表格操作按钮集的判断
    Linq改进
    C#前台直接调用后台数据时,<p>或双引号出现转义的问题
    sql 中sum函数返回null的解决方案
  • 原文地址:https://www.cnblogs.com/wuxiang/p/2568571.html
Copyright © 2011-2022 走看看