如何使用javascript根据复选框的多个部分筛选表行

我在表单中有以下复选框，允许我显示/隐藏表中的行。复选框的每个部分都可以正常工作，但是如何使一个部分检查另一部分复选框的状态，以便逻辑过滤器基于所有选择

我希望您能根据我的示例数据片段看到我正在尝试做什么：

$document.readyfunction{ $type:checkbox.clickfunction{ $td.parent.hide； $type:checkbox:checked.eachfunction{ $.+$this.val.parent.show； }; }; $fee:checkbox.clickfunction{ $td.parent.hide； $fee:复选框：checked.eachfunction{ $.+$this.val.parent.show； }; }; };

抵押类型

2年固定 3年固定 5年固定

Fee

费用 免费 2年固定 1.29 999 3年固定 1.29 999 5年固定 1.29 999 2年固定 1.29 免费 3年固定 1.29 免费 5年固定 1.29 免费

---

合并两个复选框单击处理程序，如下所示

$(":checkbox").click(function () {
    var typeVals = [],
        feeVals = [];

    $("tr").hide();
    $("#type :checkbox:checked").each(function () {
        typeVals.push($(this).val());
    });
    $("#fee :checkbox:checked").each(function () {
        feeVals.push($(this).val());
    });

    for (var i = 0; i < typeVals.length; i++) {
        for (var j = 0; j < feeVals.length; j++) {
            $('td.' + typeVals[i] + '~ td.' + feeVals[j]).closest('tr').show();
        }
    }
});

函数类型CheckBoxRow{ var bHide=真； $类型输入[类型=复选框]：已选中。每个函数{ var chkValue=$this.val； console.logchkValue； 如果$row.find'td.+chkValue.length{ bHide=false； 返回false； } }; 返回bHide； } 函数FeeCheckboxrow{ var bHide=真； $“费用输入[类型=复选框]：已选中”。每个函数{ var chkValue=$this.val； console.logchkValue； 如果$row.find'td.+chkValue.length{ bHide=false； 返回false； } }; 返回bHide； }

抵押类型

2年固定 3年固定 5年固定

Fee

费用 免费

---

这似乎并没有解决问题，它仍然会显示当您取消选中第二部分中的复选框时不应该出现的行？我希望它做的是隐藏行，除非两者都与复选框选择相匹配。加载时，所有复选框都被勾选，因此所有行都会按预期显示。当复选框从任一部分取消勾选时，如果逻辑不再正确，即一个或另一个复选框与该部分复选框不匹配，则应选中并隐藏行。虽然这在一开始似乎是可行的，但只要您取消选中第二部分中的复选框，第一部分中的所有逻辑就不再适用。这有什么意义吗？我有一个丑陋的工作示例，它检查两个部分以在表中显示结果。。检查这把小提琴