zoukankan      html  css  js  c++  java
  • jQuery checkbox 全选

    jQuery 1.6版本以后 if($("#id").attr("checked")) 不能返回 ture 和 false 

    高版本中jQuery 提供prop

    它将“属性”与“特性”做了区别,属性指的是“name,id”等等,特性指的是“selectedIndex, tagName, nodeName”等等。 
    JQ1.6之后,可以通过attr方法去获得属性,通过prop方法去获得特性

    //获取是否选中   

    var isChecked = $('#id').prop('checked');   

    //或   

    var isChecked = $('#id').is(":checked"); 

    //设置选中

    $('#id').prop('checked' true)

    <input id="btnCheckAll" type="checkbox" />全
    
            <input id="Checkbox2" name="chkItem" type="checkbox" />1
            <input id="Checkbox3" name="chkItem" type="checkbox" />2
            <input id="Checkbox4" name="chkItem" type="checkbox" />3

        <div>

    <input id="btnCheckAll" type="button" value="全选" />
    <input id="btnCheckNone" type="button" value="全不选" />
    <input id="btnCheckReverse" type="button" value="反选" />
    <input id="btnSubmit" type="button" value="提交" />
    </div>

            <script type="text/javascript">
                $(function ()
                {
                    $("#ccbCheckAll").click(function ()
                    {
                        //多种实现方式
                //方式1 //if ($("#ccbCheckAll").prop('checked')) // { //   $("input[name = 'chkItem']").prop("checked", true); // } // else // { // $("[name = chkItem]:checkbox").attr("checked", false); // }
                //方式2 $("#ccbCheckAll").prop("tagName"); //INPUT   //$("input[name='chkItem']").prop("checked", $(this).prop('checked'));
                //方式3 //$("[name = chkItem]:checkbox").prop("checked", $(this).prop('checked'));
                //方式4 $("[name = chkItem]").prop("checked", $(this).prop('checked')); }); $("input[name = 'chkItem']").click(function () { $("[name = chkItem]").prop("checked", $(this).prop('checked')); });

            

    //按钮形式

    //全选
    $("#btnCheckAll").bind("click", function ()
    {
    $("[name = chkItem]:checkbox").prop("checked", true);
    });

    // 全不选
    $("#btnCheckNone").bind("click", function ()
    {
    $("[name = chkItem]:checkbox").prop("checked", false);
    });

    // 反选
    $("#btnCheckReverse").bind("click", function ()
    {
    $("[name = chkItem]:checkbox").each(function ()
    {
    $(this).prop("checked", !$(this).prop("checked"));
    });
    });

    $("#btnSubmit").bind("click", function ()
    {
    var result = new Array();
    $("[name = chkItem]:checkbox").each(function ()
    {
    if ($(this).is(":checked"))
    {
    result.push($(this).prop("value"));
    }
    });

    alert(result.join(","));
    });

                })
                
            </script>
    

      

  • 相关阅读:
    Python生成验证码
    Django设置
    OpenStack安装后检查流程总结
    利用src.rpm包修改源码后重新制作rpm包
    Python知识点:distutils常用子模块
    libvirt, libvirt-python, libvirtd 关系浅析
    Python知识点: os.popen
    Python知识点: __import__
    修改initrd.img里ko文件的一个小tips
    关于openstack自动化安装的一点思考
  • 原文地址:https://www.cnblogs.com/ghelement/p/4572132.html
Copyright © 2011-2022 走看看