$( elem ).attr("checked") 给出相反的结果

Question

单击复选框，如果选中，则应发出选中警报；如果未选中，则应发出未选中警报。这是代码：

<input type = "checkbox" id = "all" value="all" /> MyCheckbox

 <script src="jquery-2.1.4.js"></script>
<script type="text/javascript">
    $("input[type=checkbox]").click(function(){
    if ($(this).attr("checked")) {   
alert("checked");
}
else{
alert("not checked");
}
});
</script>

最初复选框未被选中。一旦我单击它，调试器就会显示它的检查值 true。现在控制应该进入 if{} 块，因为它的值为 true，但它进入 else{} 块。（正在使用断点）。

为什么会发生这种情况。请帮助我尝试了几个小时。

Answer 1

问题是您正在检查的checked属性在检查状态更改时不会被删除或添加。这是您应该了解属性和属性的细微差别。您需要比较复选框元素的checked 属性，而不是属性。

另外，最好使用change事件处理程序（因为您不仅可以通过鼠标单击来选中复选框，还可以通过键盘来选中复选框）。

$("input[type=checkbox]").change(function() {
    if (this.checked) {
        alert("checked");
    }
    else {
        alert("not checked");
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type = "checkbox" id = "all" value="all" /> MyCheckbox