使用jQuery的.show()方法筛选元素时，原本隐藏的复选框意外显现的问题咨询

嘿，我一眼就看出问题出在哪啦！你当前用的选择器太宽泛了，导致误触发了隐藏复选框的显示逻辑。

问题根源 #

你写的这个选择器：

$('*[id*=' + this.value.toLowerCase() + ']')

它会匹配页面上所有ID包含用户输入文本的元素——包括那些被CSS隐藏的复选框！因为你的复选框ID是@Model.cats[i].Id，如果这个ID里刚好包含用户输入的内容（比如输入的"Bau"刚好在某个复选框ID里），.show()方法就会覆盖你之前设置的display: none样式，让复选框意外显示出来。

几种解决方案 #

方案1：精准定位目标元素（最推荐）

把选择器限定在你要控制的<td>元素上，不要匹配所有元素：

$('.inputhere').on('input', function () {
    const searchVal = this.value.toLowerCase();
    // 先统一隐藏所有目标td
    jQuery("td[name='isCat']").hide();
    // 只匹配符合条件的td元素并显示
    $('td[name="isCat"][id*=' + searchVal + ']').show();
    
    // 输入为空时恢复显示所有td
    if(searchVal === ''){
        jQuery("td[name='isCat']").show();
    }
});

这样就只会操作<td>，完全不会影响里面的复选框。

方案2：简化逻辑，用toggle一步完成

可以把“先隐藏再显示”的逻辑合并成.toggle()，代码更简洁：

$('.inputhere').on('input', function () {
    const searchVal = this.value.toLowerCase();
    jQuery("td[name='isCat']").each(function () {
        const tdId = $(this).attr('id').toLowerCase();
        // 输入为空 或者 td的ID包含搜索文本，就显示，否则隐藏
        $(this).toggle(searchVal === '' || tdId.includes(searchVal));
    });
});

这种方式不用分开处理隐藏和显示，逻辑更清晰。

方案3：加固复选框的隐藏样式（应急用）

如果暂时不想改JS，也可以给复选框的CSS加!important强制保持隐藏：

input[type="checkbox"] {
    display: none !important;
}

不过这种方法不够优雅，因为它会强制覆盖所有行内样式，后续如果需要动态显示复选框会有麻烦，所以优先推荐前两种方案。

另外提个小建议：如果你的筛选逻辑是想匹配标签里的文本（而不是<td>的ID），可以改成直接获取<label>的文本进行判断，这样逻辑会更贴合用户的搜索预期哦！

备注：内容来源于stack exchange，提问作者inno