jquery - 为什么不工作检查复选框？

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

Answer 1

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

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

这里的例子

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

Answer 2

您需要使用.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 3

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

如果您想测试检查的属性，请改用

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

这给了你true或者false

顺便说一句：该属性应该存在checked="checked"或根本不存在。

Answer 4

你很困惑.attr和.prop。在这里你应该使用.prop：

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

元素的attribute一个是它由标记设置的东西——你不能改变它。Aproperty反映了它现在的状态。早期版本的 jQuery 的实现存在一些混乱，现在已经解决。因此，一些在线资源仍然存在错误。