Question

我试图实施一个＆＃34;全选＆＃34;使用JQuery 1.9.1在HTML表单上的复选框。据我所知，它应该像使用 .prop 来检查或取消选中复选框一样简单，但我尝试的任何内容似乎都无效。

请参阅下面我已经尝试过的内容，我已经注释了一些失败的尝试，即使只有一个复选框，也无法让它工作。这样做的正确方法是什么？我错过了什么，可能在HTML中？

HTML

<input type="checkbox" id="cb_select_all" name="cb_select_all" value="t" />
<label for="cb_select_all"><b>Select All</b>
</label>
<br />
<input type="checkbox" name="cb1" id="cb1" class="cb_all" value="t" />
<label for="cb1">1 test</label>
<br />
<input type="checkbox" name="cb2" id="cb2" class="cb_all" value="t" />
<label for="cb2">2 test</label>

的Javascript

$(document).ready(function () {
    $("#cb_select_all").change(cb_select_all_onchange);
}); //end $(document).ready

function cb_select_all_onchange() {
    if ($("#cb_select_all").checked) {
        //$("#cb1").prop("checked", true);
        //$(".cb_all").each(function(){ this.checked = true; });
        //document.getElementById("cb1").checked = true;
        $(".cb_all").prop("checked", true);
    } else {
        $("#cb1").prop("checked", false);
    }
}

http://jsfiddle.net/mLnb5qed/5/

谢谢， JDT

Answer 1

将您的if更改为此

if ($("#cb_select_all")[0].checked) { }

（或）if ($("#cb_select_all").is(":checked")) { } 问题是第一个是本机元素的属性而不是jQuery对象。通过索引访问它使您能够使用该属性。第二种方式是jQuery方式。

Answer 2

使用

$("#cb_select_all").is(':checked');

Answer 3

这对我有用：

 $(document).ready(function () {
        $("#cb_select_all").change(function () {
            if ($("#cb_select_all").prop("checked") == true) {
                $('.cb_all').prop('checked', true);
            }
            else {
                $('.cb_all').prop('checked', false);
            }
        });
    });

会发生什么：

Check if the "cb_select_all" checkbox changes state
if the "checked" state is set to true
   check all "cb_all" checkboxes
else
   uncheck all "cb_all" checkboxes

jQuery检查复选框不起作用

3 个答案: