WordPress主题开发：表格筛选JS代码无法生效求助

问题核心原因 #

你的筛选脚本失效主要是两个细节错误导致的：

1. HTML DOM结构异常 #

在archive-challenge.php的表格末尾，你把<tbody>的闭合标签写成了<tbody>（重复开标签），正确应该是</tbody>。错误的标签会让浏览器解析DOM时出现混乱，jQuery无法正确定位表格内的行元素。

2. JS代码引号格式错误 #

main.js里用了HTML实体转义的引号"，这在JavaScript里是无效语法，直接导致脚本报错终止执行。

修复步骤 #

第一步：修正HTML的tbody标签 #

找到archive-challenge.php表格末尾的代码：

<tbody>
    </table>

改成：

</tbody>
    </table>

第二步：修正JS代码的引号与逻辑 #

把main.js里的筛选代码替换为：

jQuery(document).ready(function($) {
    // 监听搜索框键盘输入
    $("#search").keyup(function(){
        const keyword = $(this).val().toLowerCase();
        // 遍历表格行做匹配
        $("#table tbody tr").each(function() {
            const rowContent = $(this).text().toLowerCase();
            if(rowContent.indexOf(keyword) === -1) {
                $(this).hide();
            } else {
                $(this).show();
            }                
        });
    }); 
});

这里做了两处调整：

• 把HTML实体引号换成标准双引号，保证JS语法合法
• 提取变量缓存值，让代码更清晰同时提升一点性能

额外排查技巧（如果仍有问题） #

打开浏览器开发者工具（按F12）切换到控制台，查看是否有JS报错信息——哪怕排序脚本正常，也可能存在其他隐性冲突。不过按照你的描述，修复上面两个问题后应该就能正常工作。

内容的提问来源于stack exchange，提问作者f.soucy