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>

  • 相关阅读:
    Android Studio 开发
    Jsp编写的页面如何适应手机浏览器页面
    电影
    Oracle 拆分列为多行 Splitting string into multiple rows in Oracle
    sql server 2008 自动备份
    WINGIDE 激活失败
    python安装 错误 “User installations are disabled via policy on the machine”
    ble编程-外设发送数据到中心
    iOS开发-NSString去掉所有换行及空格
    ios9 字符串与UTF-8 互相转换
  • 原文地址:https://www.cnblogs.com/wuxiang/p/2568571.html
Copyright © 2011-2022 走看看