复选框打钩没有显示

Question

我有我检查和使用jQuery取消选中复选框，不过我已经越过一个bug来最主流的浏览器：

如果我改变的复选框被选中，那么选中，然后再次检查通过使用jquery，小十字不再显示，即使你检查元素的检查属性已被正确添加。

我用下面的代码更改检查属性：

$('.checkbox').attr('checked', true); 

在false替代取消勾选框。

有没有人遇到过这个问题或知道如何解决它？

Here is a fiddle that replicates the problem - 点击检查，然后取消选中，然后再次检查，你会看到蜱不再出现

Answer 1

DEMO

使用.prop()而不是.attr（）的

$("#check").click(function (e) { 
    e.preventDefault(); 
    $("#chk").prop("checked", true); 
}); 

$("#uncheck").click(function (e) { 
    e.preventDefault(); 
    $("#chk").prop("checked", false); 
}); 

阅读.prop() vs .attr()

Answer 2

您必须使用prop为：$("#chk").prop("checked", true);

http://jsfiddle.net/daL3R/2/

$("#check").click(function(e) { 
    e.preventDefault(); 
    //$("#chk").attr("checked", true); 
    $("#chk").prop("checked", true); 
}); 

$("#uncheck").click(function(e) { 
    e.preventDefault(); 
    //$("#chk").attr("checked", false); 
    $("#chk").prop("checked", false); 
}); 

Answer 3

$("#chk").prop("checked", false); 
$("#chk").prop("checked", true); 

Answer 4

使用本：

$("#check").click(function() { 
    // e.preventDefault(); 
    $("#chk").prop("checked", true); 
}); 

$("#uncheck").click(function() { 
    //e.preventDefault(); 
    $("#chk").prop("checked", false); 
});