用jquery获取checkbox的checked得到的结果是undifined的方法

上图是效果图,由以下的html代码实现:
 

<span id="param">
                        <label class="label0">参数选择:</label>
                        <input type="checkbox" id="all" value="all" checked>
                        <label id="lall" for="all" >全选</label>
                        <input type="checkbox" id="mySelect" value="w01001" checked>
                        <label for="mySelect" >pH</label>
                        <input type="checkbox" id="mySelect1" value="w01009" checked>
                        <label for="mySelect1" >溶解氧</label>
                        <input type="checkbox" id="mySelect2" value="w01010"  checked>
                        <label for="mySelect2" >水温</label>
                        <input type="checkbox" id="mySelect3" value="w01014" checked>
                        <label for="mySelect3" >电导率</label>
                        <input type="checkbox" id="mySelect4" value="w01003" checked>
                        <label for="mySelect4" >浊度</label>
                        <input type="checkbox" id="mySelect5" value="w21003" checked>
                        <label for="mySelect5" >氨氮</label>
                        <input type="checkbox" id="mySelect6" value="w21011" checked>
                        <label for="mySelect6" >总磷</label>
                        <input type="checkbox" id="mySelect7" value="w21001" checked>
                        <label for="mySelect7" >总氮</label>
                        <input type="checkbox" id="mySelect8" value="w01019" checked>
                        <label for="mySelect8" >高猛酸钾指数</label>
                        <input type="checkbox" id="mySelect9" value="w01018" checked>
                        <label for="mySelect9" >化学需氧量</label>
                        <input type="checkbox" id="mySelect10" value="e01203" checked>
                        <label for="mySelect10" >瞬时流量</label>
                        <input type="checkbox" id="mySelect11" value="w01022" checked>
                        <label for="mySelect11" >蓝绿藻</label>
                        <input type="checkbox" id="mySelect12" value="w01016" checked>
                        <label for="mySelect12" >叶绿素a</label>
                    </span>

$("#lall").click(function () {
    if($("#all").prop("checked"))
    {
        $("#param input[type='checkbox']:not('#all')").prop("checked", false);
    }
    else {
        $("#param input[type='checkbox']:not('#all')").prop("checked", true);
    }
})


$("#param input[type='checkbox']:not('#all')").click(function () {
    var allcheck=0;
    $("#param input[type='checkbox']:not('#all')").each(function () {
        if(!$(this).prop("checked")) {
            $("#all").prop("checked", false);
            allcheck=1;
        }
    })
    if(allcheck==0)
        $("#all").prop("checked", true);
})

 

总选按钮的实现需要获取其他的所有复选按钮的状态,如果用$("").attr("checked")来取复选框的属性,则得到的是undifine.

要用$("").prop("checked")来取。

原因是:

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

$("#cb").attr("tagName"); //undefined 

$("#cb").prop("tagName"); //INPUT 

那么,什么时候使用attr(),什么时候使用prop()?
1.添加属性名称该属性就会生效应该使用prop();
2.是有true,false两个属性使用prop();
3.其他则使用attr();

https://www.cnblogs.com/sdya/p/5112807.html

posted @ 2019-08-16 15:28  caxi  阅读(146)  评论(0编辑  收藏  举报