为什么这个简单的JavaScript函数不像我期望的那样工作？尝试确定是否选中了复选框

Question

我有以下形式的HTML:

<div id="filters">
    <ul>
        <li><label class="checkbox"><input type="checkbox" value="" checked data-filter=".one">One</label></li>
        <li><label class="checkbox"><input type="checkbox" value="" checked data-filter=".two">Two</label></li>
        <li><label class="checkbox"><input type="checkbox" value="" checked data-filter=".three">Three</label></li>
        <li><label class="checkbox"><input type="checkbox" value="" checked data-filter=".four">Four</label></li>
        <li><label class="checkbox"><input type="checkbox" value="" checked data-filter=".five">Five</label></li>
        <li><label class="checkbox"><input type="checkbox" value="" checked data-filter=".six">Six</label></li>
    </ul>
</div>

我的JavaScript函数如下:

<!-- language: lang-js -->
function initFilters()
{
    $('#filters input').each(function(){
        if ($(this).checked) {
            console.log($(this).attr('data-filter')+' is checked');
            addFilter($(this).attr('data-filter'));
        } else {
            console.log($(this).attr('data-filter')+' is unchecked');
            removeFilter($(this).attr('data-filter'));
        };
    });
}

我遇到的问题是$(this).checked总是返回false.

Answer 1

jQuery对象没有checked属性.试试这个:

this.checked

要么

$(this).prop("checked")

我发现第一种方式更容易阅读,它肯定更有效率,但有些人坚持使用jQuery来做所有事情,所以...