在不同頁面上錨定

Question

所以現在我有一個允許錨定的腳本，但它只能在我當前所在的頁面內工作。

$('.menu a').click(function(){ 
     var question = this.innerHTML; 
     var answer = $.find('dt:contains(' + question + ')'); 
     $('html, body').animate({ 
      scrollTop: $(answer).offset().top 
     }, 200); 
     return false; 
    }); 

    <div class="menu"> 
     <div> 
      <h3 class="heading"><a href="/about">About</a> <span class="expand">+</span></h3> 
      <ul class="subheader"> 
       <li><a href="/about">How Can You Help?</a></li> 
       <li><a href="/about">How can I submit a show?</a></li> 
       <li><a href="/about">Who are we?</a></li> 
      </ul> 
     </div> 

     <div> 
      <h3 class="heading"><a id="contact" href="contact">Contact</a> <span class="expand">+</span></h3> 
      <ul class="subheader"> 
       <li><a href="contact">Email</a></li> 
       <li><a href="contact">On Site</a></li> 
       <li><a href="contact">Social Media</a></li> 
      </ul> 
     </div> 
</div> 

我想弄清楚的是如何改變我當前的腳本，以便我可以將自己定位到下一頁的正確位置。

例如，我目前在我的「關於」頁面上，但我在我的菜單中單擊「電子郵件」。我想要發生的是，頁面將其自身重定向到聯繫人頁面，並將其自身錨定到電子郵件所在的位置。現在，它只是把我放在頁面的頂部。

我試圖不這樣做與幾個ID的，因爲這些不是我唯一的網頁，所以它不會是最好的主意，有超過30個ID只是爲了得到這個工作。我想這是我的最後一招。

Answer 1

的問題是不明確的，但我假設你有一個JavaScript函數，它接受一個字符串並找到發送用戶的正確位置。如果你想使用<a>

<li><a href="contact#email">Email</a></li> 

或者：在這種情況下，你可以在頁面加載與網頁的當前哈希運行此：

$(function() { 
    if (location.hash) { 
     var question = location.hash; 
     var answer = $.find('dt:contains(' + question + ')'); 
     $('html, body').animate({ 
      scrollTop: $(answer).offset().top 
     }, 200); 
    } 
}); 

和電子郵件的鏈接可以是這樣的內容哈希：

<li><a href="contact">Email</a></li> 
... 
$(function() { 
    $('a').each(function(){$(this).attr('url',$(this).attr('url')+'#'+$(this).text())}); 
}); 

這將打開該鏈接爲：

<li><a href="contact#Email">Email</a></li> 

Answer 2

只是做...

<li><a href="contact#email">Email</a></li> 
<li><a href="contact#onsite">On Site</a></li> 
<li><a href="contact#social">Social Media</a></li> 

然後設置頁面的youre談論

像這樣的錨....

//email section to link to 
<div id="email"></div> 
//onsite section to link to 
<div id="onsite"></div>