导航到另一页上的锚点

use*_*388 8 html navigation anchor hyperlink

我只是想从一个页面导航到另一个页面上的特定点

我有一个包含四个部分的主页.

<section>
   <a name="section1"></a>
</section>

<section id="section2">

</section>

<section>
   <a name="section3"></a>
</section>

<section id="section4">

</section>
Run Code Online (Sandbox Code Playgroud)

每页都有第2节和第4节,所以我的导航看起来像:

<nav>
      <ul>
        <li><a href="index.html#section1">ABOUT</a></li>
        <li><a href="#section2">APARTMENTS</a></li>
        <li><a href="index.html#section3">LANDLORDS</a></li>
        <li><a href="#section4">CONTACT</a></li>
      </ul>
</nav>
Run Code Online (Sandbox Code Playgroud)

链接未导航到索引页面或索引页面的所需部分.

提前致谢.

我现在有

<section>
       <a name="section1"></a>
    </section>

    <section id="section2">

    </section>

    <section>
       <a name="section3"></a>
    </section>

    <section id="section4">

    </section>
Run Code Online (Sandbox Code Playgroud)

和我的导航:

<nav>
      <ul>
        <li><a href="#section1">ABOUT</a></li>
        <li><a href="#section2">APARTMENTS</a></li>
        <li><a href="#section3">LANDLORDS</a></li>
        <li><a href="#section4">CONTACT</a></li>
      </ul>
</nav>
Run Code Online (Sandbox Code Playgroud)

它仍然无法正常工作

小智 13

您确定已将文件放在同一目录中吗?我已经测试了你提供的代码并且它正在运行.但是你可以试试这个(给段落一个id的另一种方式):

<section>
    <a id="section1">
        CONTENT
    </a>
</section>
Run Code Online (Sandbox Code Playgroud)

如果你这样做了,只需使用相同的链接方式:

<a href="different-page.html#section1">Section One</a>
Run Code Online (Sandbox Code Playgroud)


小智 7

检查您的javascript代码,找到"event.preventDefault();"的行

我在一个w3school引导程序模板中找到了这个,该模板包含了这个命令作为一个块的一部分,它可以很好地滚动到主题标签.一旦我评论出来,链接工作正常.