使用 href 和 Tocify toc [关闭]答案

【问题标题】：Using href and Tocify toc [closed]使用 href 和 Tocify toc [关闭]
【发布时间】：2013-02-21 02:18:37
【问题描述】：

我正在使用 Tocify 制作 TOC，但遇到了一些问题。在这个 TOC 中，我有：“第 1 章”、“第 2 章”...

在我的网站中，有些地方我说“请参阅第 1 章”。我必须在我的“参见第 1 章”html 文本中包含“a href”到“第 1 章”。但我不知道我必须在那个“a href=#....”中写什么。

我该怎么做？

【问题讨论】：

标签： html href tableofcontents jquery-tocify-js

【解决方案1】：

如下：

基本上，您需要为要引用的元素设置一个 ID。然后你可以写：

<a href="#id">See chapter ID</a>

<h2 id="chapter1">Chapter 1</h2>
<p>Your paragraphs</p>
<p> ... </p>
<a href="#chapter2">See chapter 2</a>

<h2 id="chapter2">Chapter 2</h2>
<p>Your paragraphs</p>
<p> ... </p>
<a href="#chapter1">See chapter 1</a>

希望对你有所帮助。

编辑：

试试这样的：

$(document).ready(function() {

  var link = $('#linkId');

  var chapter = $('#chapterId');
  var position = chapter.position(); // according to jQuery api
  var offsetTop = position.top; // this should be the absolute offset of the page's top

  // Calls the tocify method on your HTML elements.
  link.tocify();
  chapter.tocify();

  //Call the tocify method with options
  link.tocify({
    showEffect: "fadeIn"
    scrollTo: offsetTop, 
    smoothScroll: false
  });

您不能同时使用 tocify 和 #-href，因为您看到它们会覆盖 url。所以你必须使用 jQuery 或 tocify 方法（参见 api's）来滚动到特定元素。
或者您可能不想在链接上使用 tocify。

【讨论】：

谢谢。这是一个很好的解决方案。但它会更改创建 TOC 时通过 Tocify 生成的 #url。有可能得到那个 tocify 的#？
我能理解你的意思，但你可以告诉我你使用的代码吗？
使用 Tocify，当我在我的 TOC（使用 Tocify 生成）中单击“第 2 章：标题”时，我会得到 host/mysite/main.html#Chapter2:TheTitle。 #Chapter2:TheTitle 是使用 Tocify 自动生成的。如果我写
Chapter 2
....See Chapter 2（它有效）当我点击“See Chapter 2”时然后我会得到host/mysite/main.html#chapter2。我想知道是否可以使用/获取由 Tocify 生成的相同 #。
我已经更新了我的解决方案...