zoukankan      html  css  js  c++  java
  • JQuery实现 checkbox 全选、反选,子checkbox有没选去掉全选

    1. 全选的checkbox选中时,子checkbox全部选中。反之,全部不选

    2.子checkbox中,只要有没有被选中的,取消全选checkbox的选中

    3.子checkbox的数量和子checkbox被选中的数量一样时,全选checkbox要被选中

    $("input:checkbox) 相当于 $("input[type='checkbox']

    [javascript]

    //全部选择
    $("#checkall").click(function(){
      $("input:checkbox[name='checkbox[]'][disabled=false]").attr("checked", $(this).attr("checked"));
    });
    //点击判断是否全选
    $("input:checkbox[name='checkbox[]']").click(function(){
      if (!$("input:checkbox[name='checkbox[]']").checked) {
        $("#checkall").attr("checked", false);
      }
      var sumcheckbox = $("input:checkbox[name='checkbox[]']").length; //获取[name='checkbox[]']的个数
      var sumchecked = $("input:checkbox[name='checkbox[]']:checked").length; //获取选中的[name='checkbox[]']的个数
      if (sumchecked == sumcheckbox) {
        $("#checkall").attr("checked", true);
      }
    });

     


    页面代码如下:

    [html]
     
    1. <input type="checkbox" id="checkall"  value="全选" />   
    2. <input type="checkbox"  name="checkbox[]  value="1" />  
    3. <input type="checkbox"  name="checkbox[] value="2" />  
    4. <input type="checkbox"  name="checkbox[]  value="3" />  
    5. <input type="checkbox"  name="checkbox[]  value="4" />  
  • 相关阅读:
    NOIP2009 靶形数独
    NOIP2014 寻找道路
    NOIP2005 篝火晚会
    NOIP2014 联合权值
    NOIP2011 选择客栈
    luogu2659 美丽的序列
    NOIP2008 传纸条
    vijos1642 班长的任务
    codevs1427 RQNOJ204 特种部队
    AC自动机
  • 原文地址:https://www.cnblogs.com/gaoyinghui/p/3600078.html
Copyright © 2011-2022 走看看