• 关于checkbox的全选和反选实例


    <script type="text/javascript">
    $(function () {

    $("#checkAll").click(function () {//点击全选
    var allLength = $(":checkbox[id!='checkAll']").length; //复选框的个数
    var checkLength = $(":checkbox[id!='checkAll']:checked").length; //复选框被选中的个数
    if (allLength == checkLength) { //处于全选状态

    $(":checkbox[id!='checkAll']").each(function () {//所有选框依次取消
    $(":checkbox[id!='checkAll']").attr("checked", false);
    })

    }
    else {//不处于全选状态

    $(":checkbox[id!='checkAll']").each(function () {//所有选框依次选中
    $(this).attr("checked", $("#checkAll").attr("checked"));
    })
    }


    })
    $(":checkbox[id!='checkAll']").click(function () {//点击一个普通复选框
    var allLength = $(":checkbox[id!='checkAll']").length; //复选框的个数
    var checkLength = $(":checkbox[id!='checkAll']:checked").length; //复选框被选中的个数
    if (allLength == checkLength) { //处于全选状态

    $("#checkAll").attr("checked", true);//全选按钮选中

    }
    else {

    $("#checkAll").attr("checked", false);//全选按钮的非选中状态
    }
    })

    })

    </script>

    全选<input id="checkAll" name="checkAll" type="checkbox" />
    <table>
    <tr> <td>
    <input id="Checkbox0" name="CheckIt" type="checkbox" />
    </td>
    <td>选项一</td>
    </tr>
    <tr> <td>
    <input id="Checkbox1" name="CheckIt" type="checkbox" />
    </td>
    <td>选项二</td>
    </tr>
    <tr> <td>
    <input id="Checkbox2" name="CheckIt" type="checkbox" />
    </td>
    <td>选项三</td>
    </tr>
    <tr> <td>
    <input id="Checkbox3" name="CheckIt" type="checkbox" />
    </td>
    <td>选项四</td>
    </tr>
    </table>

  • 相关阅读:
    JAVA的反射理解
    网络编程-小结
    JAVA多线程的总结
    Mysql基本语句的总结
    IO流
    JAVA集合介绍
    时间复杂度
    JAVA面向对象-多态的理解
    求A的B次方
    最大公约数
  • 原文地址:https://www.cnblogs.com/fkcxy/p/5805647.html
Copyright © 2020-2023  润新知