javascript - 为什么这个简单的 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， 所以...