新版本 Hugo 下点击 toc 时存在 bug

[zstcode]

#240 中 @panda-z 提到

Hugo (>=0.60.0) uses Goldmark as default renderer.
You may add the following settings to your config.toml.

[markup]
 [markup.tableOfContents]
   endLevel = 3
   ordered = false
   startLevel = 2

但是 even 在点击 toc 里面的标题后滚动到该位置以后似乎是先计算出位于页面上方标题在所有标题中的的位置，再用这个位置在 toc 所有链接中选择高亮。

hugo-theme-even/assets/js/even.js

Lines 89 to 125 in 620ff81

	const $toclink = $('.toc-link');
	const $headerlink = $('.headerlink');
	const $tocLinkLis = $('.post-toc-content li');
	const headerlinkTop = $.map($headerlink, function(link) {
	return $(link).offset().top;
	});
	const headerLinksOffsetForSearch = $.map(headerlinkTop, function(offset) {
	return offset - HEADERFIX;
	});
	const searchActiveTocIndex = function(array, target) {
	for (let i = 0; i < array.length - 1; i++) {
	if (target > array[i] && target <= array[i + 1]) return i;
	}
	if (target > array[array.length - 1]) return array.length - 1;
	return -1;
	};
	$(window).scroll(function() {
	const scrollTop = $(window).scrollTop();
	const activeTocIndex = searchActiveTocIndex(headerLinksOffsetForSearch, scrollTop);
	$($toclink).removeClass('active');
	$($tocLinkLis).removeClass('has-active');
	if (activeTocIndex !== -1) {
	$($toclink[activeTocIndex]).addClass('active');
	let ancestor = $toclink[activeTocIndex].parentNode;
	while (ancestor.tagName !== 'NAV') {
	$(ancestor).addClass('has-active');
	ancestor = ancestor.parentNode.parentNode;
	}
	}
	});
	};

如果没有将 h1-h6 全部显示出来，那么点击比较后面的目录时，就会高亮错误的链接。因为页面标题和 toc 中链接长度不一致。

以 example-site 中的 even-preview 为例，在 Hugo v0.72.0 默认的 toc 设置下显示出来的是 h2-h3 ，点击 toc 中的 Abbreviation，高亮显示的是 Dictionary

[opfanswyx]

#240 中 @panda-z 提到

Hugo (>=0.60.0) uses Goldmark as default renderer.
You may add the following settings to your config.toml.

[markup]
 [markup.tableOfContents]
   endLevel = 3
   ordered = false
   startLevel = 2

但是 even 在点击 toc 里面的标题后滚动到该位置以后似乎是先计算出位于页面上方标题在所有标题中的的位置，再用这个位置在 toc 所有链接中选择高亮。

hugo-theme-even/assets/js/even.js

Lines 89 to 125 in 620ff81

	const $toclink = $('.toc-link');
	const $headerlink = $('.headerlink');
	const $tocLinkLis = $('.post-toc-content li');
	const headerlinkTop = $.map($headerlink, function(link) {
	return $(link).offset().top;
	});
	const headerLinksOffsetForSearch = $.map(headerlinkTop, function(offset) {
	return offset - HEADERFIX;
	});
	const searchActiveTocIndex = function(array, target) {
	for (let i = 0; i < array.length - 1; i++) {
	if (target > array[i] && target <= array[i + 1]) return i;
	}
	if (target > array[array.length - 1]) return array.length - 1;
	return -1;
	};
	$(window).scroll(function() {
	const scrollTop = $(window).scrollTop();
	const activeTocIndex = searchActiveTocIndex(headerLinksOffsetForSearch, scrollTop);
	$($toclink).removeClass('active');
	$($tocLinkLis).removeClass('has-active');
	if (activeTocIndex !== -1) {
	$($toclink[activeTocIndex]).addClass('active');
	let ancestor = $toclink[activeTocIndex].parentNode;
	while (ancestor.tagName !== 'NAV') {
	$(ancestor).addClass('has-active');
	ancestor = ancestor.parentNode.parentNode;
	}
	}
	});
	};

如果没有将 h1-h6 全部显示出来，那么点击比较后面的目录时，就会高亮错误的链接。因为页面标题和 toc 中链接长度不一致。

以 example-site 中的 even-preview 为例，在 Hugo v0.72.0 默认的 toc 设置下显示出来的是 h2-h3 ，点击 toc 中的 Abbreviation，高亮显示的是 Dictionary

看到了一个pull requests #271 (comment) 在自己本地改一下，好像可以生效。