Question

代码：

<input type="checkbox" id="test1" class="check" checked="">
<input type="checkbox" id="test2" class="check" checked="">
<input type="checkbox" id="test3" class="check" checked="">
<input type="checkbox" id="test4" class="check" checked="">

    <button class="start">Click</button>

$(".start").click(function(){

alert($("#test1").attr("checked"));

});

为什么我删除选中复选框 test1 alert显示选中？

测试JsFiddle here

Answer 1

您需要使用.prop代替.attr。

http://api.jquery.com/prop/

相关部分：

elem.checked                     true (Boolean) Will change with checkbox state
$(elem).prop("checked")       true (Boolean) Will change with checkbox state
elem.getAttribute("checked")      "checked" (String) Initial state of the checkbox; does not change
$(elem).attr("checked") (1.6)     "checked" (String) Initial state of the checkbox; does not change
$(elem).attr("checked") (1.6.1+)  "checked" (String) Will change with checkbox state
$(elem).attr("checked") (pre-1.6) true (Boolean) Changed with checkbox state

Answer 2

如果要在选中复选框时运行警报，请使用以下命令：

if ($("#test1").is(':checked') ) {alert("yes")}

示例here

$(".start").click(function(){
   if ($("#test1").is(':checked') ) {alert("yes")}    
});

Answer 3

我想这是因为您正在测试静态HTML。

如果要测试已检查属性，请改用

alert($("#test1").prop("checked"));

这会为您提供true或false

BTW：该属性应为checked="checked"或根本不存在。

Answer 4

你让.attr和.prop感到困惑。在这里，您应该使用.prop：

alert($("#test1").prop("checked"));

元素的attribute是由标记设置的 - 你无法改变它。 property现在反映了它的状态。早期版本的jQuery中的实现存在一些混乱，现在已经解决了。因此，一些在线资源仍然存在错误。

为什么不工作复选框？

4 个答案: