Javascript 筛选表行-带有全选复选框的多个筛选器

首先，我正在尝试选中全部复选框如果我在表格标题中单击全部选中复选框，整个表格行将被选中，并将显示一条复选框计数器消息，说明我选中了多少复选框此处，问题是如果我单击“全选”复选框，计数器消息不会显示我选择了多少行的楼上表格

其次，如果我从任何列中筛选任何数字，相同的数字将显示获得筛选行后同一列中有多少行具有相同的数字如果我选中所有复选框，则计数器消息将显示我选中了多少行复选框此处，问题是显示整个表行计数器消息，而不是显示筛选行计数器消息

但是解决这个问题我面临一个问题。我怎样才能解决这个问题

$（文档）.ready（函数（）{
$（'.ckbCheckAll.checkBoxClass'）。单击（函数（）{
如果（$（'.ckbCheckAll:checked'）.length>0 | |$（'.checkBoxClass:checked'）.length>0）{
$（'.checkbox count content'）.show（500）；
}否则{
$（'.checkbox count content'）.hide（500）；
}
})
const countCheckedAll=函数（）{
常量计数器=$（“.checkBoxClass:checked”）.length；
$（“.checkbox count”）.html（计数器+“已选择变体！”）；
console.log（计数器+'variation selected！'）；
};
$（.checkBoxClass”）。在（“单击”，countCheckedAll）；
$（'.ckbCheckAll'）。单击（函数（）{
常量bulkIds=$（'input[type=“number'）.val（）；
log（bulkIds+'selected！'）；
如果（bulkID！=''）{
bulkIds.split（'/'）.forEach（函数（）{
$（'tbody'）.find（'.checkBoxClass'）.prop（'checked'，true）；
$（this.closest（'table'）.find（'td.checkBoxClass'）.prop（'checked'，this.checked））；
countCheckedAll（）；
})
}否则{
$（“.checkBoxClass”）.prop（'checked'，$（this.prop（'checked'））；
}
})
$（“.checkBoxClass”）.change（函数（）{
如果（！$（此）.prop（“选中”））{
$（.ckbCheckAll”）.prop（“选中”，假）；
}
});
常数aggrFn={
“=”：（a，b）=>a==b，
“”：（a，b）=>a>b，
“=”：（a，b）=>a>=b，
};
函数筛选器列（$table）{
常量colFilters={}；
$table.find（“thead.filter”）。每个（函数（）{
colFilters[$（this）.index（）]={
agg:$（this.find（“select”）.val（），
val:$（this.find（“input”）.val（），
}
});
$table.find（“tbody tr”）。每个（函数（）{
const$tr=$（此项）；
const shoulhide=Object.entries（colFilters）.some（[k，v]）=>{
返回v.val==“”？false:！aggrFn[v.agg]（parseFloat（$tr.find（`td:eq（${k}）`）.text（）），parseFloat（v.val））；
});
$tr.toggleClass（“u-none”，shouldHide）；
});
}
$（“.filter”）.on（“输入”，“输入”，函数（ev）{
filterColumns（$（this）.closest（“table”）；
});
})；

表格{
宽度：100%；
边界塌陷：塌陷；
}
运输署{
文本对齐：居中；
填充：10px；
}
表THAD tr th{
边框：1px实心#中交；
填充：10px；
}
表tbody tr td{
边框：1px实心#中交；
}
.filter>div{
显示器：flex；
证明内容：中心；
}
.过滤器输入{
宽度：6em；
}
无{
显示：无；
}

可用数量
=
≤
≥
正常价格
=
≤
≥
底价
=
≤
≥
4.
10
12
6.
12
11
1.
14
12
0
8.
10
6.
14
18
1.
11
22
6.
10
8.

您可以使用

：visible

检查trs是否可见，然后只需将checked添加到仅那些trs复选框的true，然后调用函数显示count，否则只需从复选框中删除checked即可

演示代码：

$（文档）.ready（函数（）{
$（'.ckbCheckAll.checkBoxClass'）。单击（函数（）{
如果（$（'.ckbCheckAll:checked'）.length>0 | |$（'.checkBoxClass:checked'）.length>0）{
$（'.checkbox count content'）.show（500）；
}否则{
$（'.checkbox count content'）.hide（500）；
}
})
const countCheckedAll=函数（）{
常量计数器=$（“.checkBoxClass:checked”）.length；
$（“.checkbox count”）.html（计数器+“已选择变体！”）；
console.log（计数器+'variation selected！'）；
};
$（.checkBoxClass”）。在（“单击”，countCheckedAll）；
$（'.ckbCheckAll'）。单击（函数（）{
如果（$（this）.is（“：checked”））{
//获取可见的tr。将选中的添加到该复选框
$（'tbody'）.find（'tr:visible.checkBoxClass'）.prop（'checked'，true）；
countCheckedAll（）；
}否则{
//删除选中的
$（“.checkBoxClass”）.prop（'checked'，false）；
$（'.checkbox count content'）.hide（500）；
}
})
$（“.checkBoxClass”）.change（函数（）{
如果（！$（此）.prop（“选中”））{
$（.ckbCheckAll”）.prop（“选中”，假）；
}
});
常数aggrFn={
“=”：（a，b）=>a==b，
“”：（a，b）=>a>b，
“=”：（a，b）=>a>=b，
};
函数筛选器列（$table）{
常量colFilters={}；
$table.find（“thead.filter”）。每个（函数（）{
colFilters[$（this）.index（）]={
agg:$（this.find（“select”）.val（），
val:$（this.find（“input”）.val（），
}
});
$table.find（“tbody tr”）。每个（函数（）{
const$tr=$（此项）；
有限公司