jQuery toggle()添加的style="display:none"属性无法隐藏元素如何解决

云原生阿岚

2026-9-23

问题排查与修复方案

核心错误

你提到生成的样式属性为style="sidplay:none"，这里存在CSS属性拼写错误：控制元素显隐的合法属性是display，写错属性名会导致浏览器无法识别，自然不会触发隐藏效果。

原生jQuery的toggle()方法不会生成错误的属性名，出现该问题可按以下优先级排查：

排查是否有自定义代码、第三方插件重写了jQuery的toggle()方法，导致属性生成逻辑异常
排查目标h3元素是否存在带!important标记的display相关CSS规则，高优先级规则会覆盖行内样式，导致toggle的显隐控制失效

替代实现方案

你可以直接手动控制样式属性，规避toggle方法被篡改的问题：

WikiOption.Elements.searchInput.on("input", (e)=> {
    const searchVal = $(e.target).val().toLowerCase();
    $(".toc-wrap h3").each(function () {
        const matchRes = $(this).text().toLowerCase().includes(searchVal);
        $(this).css('display', matchRes ? 'block' : 'none');
    });
});