跳到另一頁上的某個部分無法正常工作

Question

我有這樣的導航欄：

               <ul class="dropdown-menu" role="menu">
                 <li><a href="/main_page#top_something">People</a></li>
                 <li><a href="/main_page">Main Page</a></li>
               </ul>

但是，當我單擊“人”鏈接時，它的位置將不正確，因為我正在該頁面上加載一些圖表。 我有很多具有唯一ID的部分，並且內容是從JavaScript（圖表）加載的。

       <section id="top_something">
         <div class= "container">
          <h2 class="blue-headings text-center"><b>Top People</b></h2>
          <div id="div_something"></div>
         </div>
        <br>
    </section>

我在JavaScript中制作的div id =“ div_something”的內容...在該main_page上有一個具有唯一ID的10 div這樣的內容。 我可以看到，當我單擊導航欄上的aa href =“ / main_page＃top_something”時，它將粘貼到該部分，但是一旦加載JavaScript，它就會將我移到上方

提前致謝

Answer 1

如果您的main_page是一個目錄（可能是目錄），那么您只需在錨名稱之前添加一個斜杠即可。

<a href="/main_page/#top_something">People</a>

如果您在頁面加載后有JavaScript注入內容，那么您將被帶到適當的錨點，但頁面可能會移動，因為JS添加的其他內容會將錨點推向頁面的下方。 您可以考慮在完成內容注入后使用JS將屏幕重新定位到適當的錨點。