Jquery - Checkbox保持检查 - 简单的过滤系统

Question

我正在构建一个非常简单的过滤系统,我想要有html复选框,可以显示和隐藏特定类别的项目.

问题是复选框无论如何都会保持检查状态.

关于jsfiddle的例子:http://jsfiddle.net/Jmnwr/

HTML:

<ul id="filters">
    <li><input type="checkbox" checked="checked" value="categorya" id="filter-categorya" /><label for="filter-categorya">Category A</label></li>
    <li><input type="checkbox" checked="checked" value="categoryb" id="filter-categoryb" /><label for="filter-categoryb">Category B</label></li>
</ul>

<div class="categorya"></div>
<div class="categorya"></div>
<div class="categorya"></div>
<div class="categorya"></div>
<div class="categoryb"></div>
<div class="categoryb"></div>
<div class="categoryb"></div>

JS:

$("#filter-categorya").toggle(
function() {
    $('.categorya').stop().fadeTo('slow', 0.2);
    $('#filter-categorya').removeAttr('checked');
}, function() {
    $('.categorya').stop().fadeTo('slow', 1.0);
    $('#filter-categorya').attr('checked', 'checked');
});

$("#filter-categoryb").toggle(
function() {
    $('.categoryb').stop().fadeTo('slow', 0.2);
    $('#filter-categoryb').removeAttr('checked');
}, function() {
    $('.categoryb').stop().fadeTo('slow', 1.0);
    $('#filter-categoryb').attr('checked', 'checked');
});

我看过两篇关于这个主题的帖子,但不确定它们是否完全相关,或者为什么我的代码特别不起作用.我也尝试过使用preventdefault函数,但它没有做任何事情:

无法控制复选框检查状态 - jquery 为什么不设置.attr('checked','checked')？

任何帮助总是赞赏,谢谢!

Answer 1

它被阻止了preventDefault().看看这个:http://jsfiddle.net/q8bAE/5/您可以看到第二个复选框正常工作,而第一个复选框在单击时保持其初始状态.

似乎preventDefault()导致复选框更改操作停止...直到现在我才知道!文档toggle()说"实现也在事件上调用.preventDefault()"