docsifyjs / docsify

🃏 A magical documentation site generator.

Home Page:https://docsify.js.org

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

左侧搜索栏,中文路径时出现乱码

janycode opened this issue · comments

你好,我在使用docsify的过程中,安装了 search 插件,因为我的文件路径是带有中文的,搜索结果出现了中文转码为乱码的问题

问题重现:进入以下链接,点击左上角搜索,比如搜索"redis"然后展示搜索结果后,结果的标题是乱码的。

地址:https://janycode.gitee.io/#/./05_%E6%95%B0%E6%8D%AE%E5%BA%93/04_Redis/01-Redis%20%E7%8E%AF%E5%A2%83%E6%90%AD%E5%BB%BA

如图所示:
image

image
这是我使用的 docsify 版本:4.4.4

commented

建议使用英文,这里会进行转义。

建议使用英文,这里会进行转义。

如果必须使用中文,有后置的方法吗? 我尝试在 浏览器控制台将乱码进行了一次解码,发现可以正确得到中文的路径,只是不清楚如何让他自动设置回去。
求大佬指导指导
image

因为我这里同时也会作为左侧的目录使用,本地维护也是方便查阅和编辑,所以都用的中文。

commented

你自己在sidebar中使用中文就可以,但是文件路径需要使用英文的

image

如图,我只是像在搜索结果展示时通过其他方式回写一下 搜索结果的 h2 标签,强制 decode 一次。
如果 window.$docsify 中的 search 属性中不支持 类似 markdown 的 renderer 的话,我就只能自己写 js来实现啦 -_-

image

解决了,附上JS代码。

<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<script>
    $(function () {
        $('input').bind('input propertychange', function () {
            var inputVal = $(this).val();
            if (inputVal) {
                console.log("输入搜索内容:" + inputVal);
                //必须后置回显h2标签,经测试延时100ms可以
                setTimeout(function () {
                    $('div.matching-post a h2').each(function (index, value) {
                        var finalH2Text = decodeURI(value.innerText);
                        if (finalH2Text.indexOf("/") > 0) {
                            var textArr = finalH2Text.split("/");
                            finalH2Text = textArr[textArr.length - 1];
                            $(this).text(finalH2Text);
                        }
                    });
                }, 100);
            } else {
                console.log("其他");
            }
        });
    })
</script>