jquery使用Materialize开关

Question

已编辑：下面更改了jQuery - 现在我在控制台中获得了具有给定类（单列）的未选中复选框的数量的正确计数，但在if语句中，我仍然得到它们都是未选中的，即使2检查，并在我的数据中取消选中10个。

我有一个动态填充和创建的表，在某些列中，我使用Materialize开关在数据库中设置值。

我想使用这些列上的Materialize复选框将表格过滤到＆＃34; on＆＃34;中的那些开关。位置。这是“检查”＃39;在HTML中。

我在其他列上有文字字段，并且已成功过滤这些字段，但我无法弄清楚如何在行检查＆＃39;＆＃39;的行上引用特定列。

<table>
    <tr>
        <td>
            <div class="switch">
                Selected<br />
                <label>
                Off
                <input type="checkbox" class="isSelected" checked="    {{isSelected}}">
                <span class="lever"></span>
                On
                </label>
            </div>
        </td>
        <td>
            <div class="switch">
                Checked In<br />
                <label>
                Off
                <input type="checkbox" class="isCheckedIn" checked="    {{isCheckedIn}}">
                <span class="lever"></span>
                On
                </label>
            </div>
        </td>
     </tr>
</table>

这个id在Meteor中完成，所以把手值基本上给出了检查或假，以便根据数据库值动态地将开关打开。

JQuery的

'click .checkFilter' (event) {
    // console.log('checked or unchecked');
    var colId = event.currentTarget.id;
    var state = event.currentTarget.checked;
    $row = $('#table tr.trMainData');
    // console.log('State of ' + colId + ' is now ' + state);
    console.log($('input:checkbox.isSelected:not(:checked)').length);
    $('table tr.trInner').each(function() {
        if ($('input:checkbox.isSelected:not(:checked)')) {
            console.log('Unchecked: ' + $.trim($(this).find('td').eq(0).text()));
            $row.hide();
        } else {
            console.log('Checked' + $.trim($(this).find('td').eq(0).text()));
            $row.show();
        }
    });

如果它能够检测到列中的某个项目被检查，我现在只是试图控制日志记录，而我甚至都不会这样做。

非常感谢任何帮助。

Answer 1

好吧，我已经摆弄了一吨，发现了一种更简单的方法。

基本上替换所有：

$('table tr.trInner').each(function() {
    if ($('input:checkbox.isSelected:not(:checked)')) {
        console.log('Unchecked: ' + $.trim($(this).find('td').eq(0).text()));
        $row.hide();
    } else {
        console.log('Checked' + $.trim($(this).find('td').eq(0).text()));
        $row.show();
    }
});

使用以下单行：

$('input:checkbox.isSelected:not(:checked)').closest('.trMainData').hide();

请参阅，我的表中有一个嵌套的tr，所以我需要隐藏类trMainData的主行，而我正在查看内部的td元素行trInner的行。

因此，使用上面的行，我识别出未检查的类isSelected的表格单元格，然后告诉页面使用jquery closest()函数使用它的类来隐藏主行。

呼！