javascript - 按复选框值过滤 javascript 不起作用

Question

我正在尝试通过复选框值过滤我的页面。这样，只要该值存在于特定行中，它就会过滤该行。我的代码的问题是 if check 甚至没有触发。我知道这一点是因为控制台日志消息测试没有显示。我在控制台中没有收到任何语法错误，但没有看到该复选框已被选中。我是 JavaScript 菜鸟。当选中该复选框时，不应该触发以下代码吗？

var $row = $("#data tr"),
    $filter_poweron = $("#poweron");

if($filter_poweron.checked) {
console.log('test');
    var filterText_poweron = $filter_poweron.val().toLowerCase();
    $row.each(function () {
        var $row_d = $(this);
        $row_d.toggle($row_d.text().toLowerCase().indexOf(filterText_poweron) > -1);
    });
}

<br><input type="checkbox" id="poweron" value="1O">PoweredOn <input type="checkbox" id='poweroff' value="0F"> PoweredOff

Answer 1

$filter_poweron 是一个 jQuery 对象。 jQuery 对象没有 checked属性。

您可以使用 .prop() 获取 DOM 元素的 checked 属性:

var $row = $("#data tr"),
    $filter_poweron = $("#poweron");

if ($filter_poweron.prop('checked')) {
    console.log('test');
    var filterText_poweron = $filter_poweron.val().toLowerCase();
    $row.each(function () {
        var $row_d = $(this);
        $row_d.toggle($row_d.text().toLowerCase().indexOf(filterText_poweron) > -1);
    });
}

还有其他方法可以查看复选框元素是否被选中:

$filter_poweron[0].checked;
$filter_poweron.is(':checked');
$filter_poweron.filter(':checked').length;