Aplayer conflicts with hexo-toc

[huweihuang]

I use MetingJs for my website, and MetingJs use Aplayer. The problem is the Chinese title field of my article cannot be linked properly,which is generated by hexo-toc. If I disable the use of Aplayer(MetingJS), this problem is solved.So I guess that aplayer conflicts with hexo-toc, causing Chinese to fail to parse normally.But I don't know how to solve this problem. Can someone help me?

my website code reference:https://github.com/huweihuang/www.huweihuang.com/blob/master/themes/huweihuang/layout/post.ejs#L38

Article link：https://www.huweihuang.com/article/kubernetes/kubernetes-resource/ (The English title of the article can be parsed normally, but the Chinese title cannot be parsed normally.)

MetingJS issue:https://github.com/metowolf/MetingJS/issues/5

[scillidan]

mark一个。同样的问题

[ihuanrong]

我也遇到了相同的问题，希望作者能够解决。

[ZeppLu]

这个问题是aplayer依赖的webpack引入的smoothscroll.js导致的，它给hashtag链接的click事件增加了listener，但是却不能正确处理含有中文的hashtag链接（因为url编码）。这玩意儿17年到现在都没更新过，也难怪。

解决方法是将含有hashtag链接的node复制一份替换掉原来的，这样就能移除掉所有的event listener，详见https://stackoverflow.com/a/9251864

不过有一说一，一个音乐播放器，为什么要依赖另一个功能完全无关（用于平滑滚动页面）的脚本呢？

[tianheg]

@huweihuang I just checked it on your blog and found that your conflict has been resolved. I also encountered this problem, so I put the following code originally in head.html directly into the about.md, and it works !

<!-- require APlayer -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.css">
<script src="https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.js"></script>
<!-- require MetingJS -->
<script src="https://cdn.jsdelivr.net/npm/meting@2/dist/Meting.min.js"></script>

And I see your "about"'s source code, we do the same. 😂

[stevenjoezhang]

It's still not fixed: https://github.com/hexojs/hexo/issues/4488