Content's link show 'undefine'

[lds8988]

The post widget 'sidebar' can list the toc of the article, but the end of the link show '#undefined', thus when I click the link, it can not slide to the right position of the article. Any one can tell me why please ?

[huweihuang]

1、同样遇到这个问题，具体的问题现象可参考链接，http://www.huweihuang.com/article/kubernetes/kubernetes-architecture/#undefined 侧边栏目录点击时，无法跳转到对应的标题，URL会显示undefined。但是为什么 http://beantech.org/2017/03/18/hexo-theme-beantech/#modify 的没有问题。 2、如果文章本身已经标题带有编序号，如何设置可以自定义侧边栏自带的序号不显示，谢谢！

[allonli]

I have the same problem.

[YenYuHsuan]

@lds8988 @huweihuang @allonli sorry for the late reply I've tried three times from different PCs, but the result is all good to me. so can you guys provide more details about how you setup the blog thx :+1:

[fawks96]

Actually this is an issue caused by the package hexo-toc. Something has been updated so bad situation happened. @YenYuHsuan don't have this problem maybe because you are using the old version of this. Here is the solution I got from a kindly friend of mine, now I share with you. Hope it will solve your problem:

// 初步排查

经过简单的排查，发现现在编译出的html内容中，如下的markdown：

## title

原来会被编译成 <h2 id="title">title</h2>

而现在会被编译成 <h2><span id="title">title</span></h2>

推测因此导致了生成toc时，h2元素的id属性为undefined，进而导致toc中的锚点也为undefined的问题。

// 解决

以上的变更，是package hexo-toc的变更导致的，具体应该是这次commit：https://github.com/bubkoo/hexo-toc/blob/7c9624c2d3fb7d13ce973cb8de4dc10ff865c089/lib/filter.js#L28

但是目前仅仅是初步排查，暂时没有确定问题就是出在 hexo-toc 上，仅仅是认为这个修改可能会导致后续某些生成toc的代码的不兼容。

因此目前阶段，进入你项目根目录的 node_modules/hexo-toc/lib/filter.js 中，把28行~31行修改为：

$title.attr('id', id);
// $title.children('a').remove();
// $title.html( '<span id="' + id + '">' + $title.html() + '</span>' );
// $title.removeAttr('id');

也就是恢复这次commit，仅保留28行，其他的内容注释掉。这样的话，生成的toc应该就是正常的了。

p.s. 另外需要注意的是，编译的markdown貌似有缓存，因此修改后，你可以再新建一篇文章后再generate，用新文章测试以上手段是否有效fix。旧文章由于缓存问题，可能不会生成新的html（这部分也只是看到现象，暂时没有进行详细了解）。如果新文章确实能够fix此问题，再处理旧文章即可。

根本原因是，在上面提到的 hexo-toc 的commit中，在HTML生成前，它去掉了 <h2> 等标签的id属性，而是将其放入内部新生成的span中。而hexo本身生成toc的时候，取得仍是 <h2> 标签的id，因此得到的是undefined。具体代码在这里：https://github.com/hexojs/hexo/blob/master/lib/plugins/helper/toc.js#L27 在这里做兼容的fix应该也是可以的。

@lds8988 @huweihuang @allonli

[YenYuHsuan]

@fawks96 Thx for your solution But here is a simple way from your solution is to check your package.json cause you run npm install, It'll depend on the package.json to install them so that the hole dependencies can be the same as mine right now.

BTW I have some other clue might be the solution I've changed the default markdown renderer from hexo-renderer-marked to hexo-renderer-markdown-it you might need to check which one you are using. Hope this can help you Peace!

[HanchengZhao]

@fawks96 Thank you for providing the solution, it works for me.

[huweihuang]

@fawks96 @YenYuHsuan 谢谢，按照 @fawks96 的方法，toc link “undefined”的问题已经解决。顺便想问下，因为我写文章习惯将标题用序号表示，例如1. xxx ,1.1 xxx,1.2 xxx ,2. xxx，但是toc 目录会自动添加序号，导致显示时重复显示序号，能否设置开关在page里面参数的形式来确定是否开启显示 toc-nav-number 的序号，类似page 中 catalog: true的开关参数，方便我控制目录中不重复显示序号。具体问题现象可以参考链接右侧中的目录，序号重复显示：http://www.huweihuang.com/article/kubernetes/kubernetes-architecture/

[YenYuHsuan]

@huweihuang let's discuss this issue here #14

[zhezhang007]

Thanks @fawks96, this problem bothered for many days, fixed it by your suggestions. Problem: TOC in the side bar not defined.

[huweihuang]

@fawks96 @YenYuHsuan 使用以下方式是可以解决该问题，但是如果重新npm install全部包后，hexo-toc插件就会加载了最新代码，又得重新修改一次比较麻烦，有没有其他方式可以不在第三方包hexo-toc的基础修改。

$title.attr('id', id);
// $title.children('a').remove();
// $title.html( '<span id="' + id + '">' + $title.html() + '</span>' );
// $title.removeAttr('id');

[Hustcw]

@fawks96 感谢

[Zirpon]

mark

[xiaohei07]

Actually this is an issue caused by the package hexo-toc. Something has been updated so bad situation happened. @YenYuHsuan don't have this problem maybe because you are using the old version of this. Here is the solution I got from a kindly friend of mine, now I share with you. Hope it will solve your problem:

// 初步排查

经过简单的排查，发现现在编译出的html内容中，如下的markdown：

## title

原来会被编译成 <h2 id="title">title</h2>

而现在会被编译成 <h2><span id="title">title</span></h2>

推测因此导致了生成toc时，h2元素的id属性为undefined，进而导致toc中的锚点也为undefined的问题。

// 解决

以上的变更，是package hexo-toc的变更导致的，具体应该是这次commit：https://github.com/bubkoo/hexo-toc/blob/7c9624c2d3fb7d13ce973cb8de4dc10ff865c089/lib/filter.js#L28

但是目前仅仅是初步排查，暂时没有确定问题就是出在 hexo-toc 上，仅仅是认为这个修改可能会导致后续某些生成toc的代码的不兼容。

因此目前阶段，进入你项目根目录的 node_modules/hexo-toc/lib/filter.js 中，把28行~31行修改为：

$title.attr('id', id);
// $title.children('a').remove();
// $title.html( '<span id="' + id + '">' + $title.html() + '</span>' );
// $title.removeAttr('id');

也就是恢复这次commit，仅保留28行，其他的内容注释掉。这样的话，生成的toc应该就是正常的了。

p.s. 另外需要注意的是，编译的markdown貌似有缓存，因此修改后，你可以再新建一篇文章后再generate，用新文章测试以上手段是否有效fix。旧文章由于缓存问题，可能不会生成新的html（这部分也只是看到现象，暂时没有进行详细了解）。如果新文章确实能够fix此问题，再处理旧文章即可。

根本原因是，在上面提到的 hexo-toc 的commit中，在HTML生成前，它去掉了 <h2> 等标签的id属性，而是将其放入内部新生成的span中。而hexo本身生成toc的时候，取得仍是 <h2> 标签的id，因此得到的是undefined。具体代码在这里：https://github.com/hexojs/hexo/blob/master/lib/plugins/helper/toc.js#L27 在这里做兼容的fix应该也是可以的。

@lds8988 @huweihuang @allonli

十分感谢，这帮助我解决了今天头疼了一天的问题！