使用錨顯示div

Question

我正在使用jquery，並且需要完成一些事情。

1）當有人點擊一個鏈接（或在我的情況下，div）顯示另一個div，我想添加一個錨點的URL。

所以，如果有人點擊「Live」鏈接，'live'div滑落，我們將追加#live到網址。

2）如果有人訪問該頁面並將#live錨點保留在url的末尾，那麼'live'div應該立即可見。

我知道如何處理slideDown（）的基本部分，如果有人點擊一個div。我不知道如何追加hashtag，或者使它在加載頁面時檢查hashtag並顯示相應的div。

任何幫助理解這一點，將不勝感激。提前致謝。

Answer 1

Appening哈希的URL是操縱location.hash，例如簡單：

$("a.live").click(function() { 
    window.location.hash = 'live'; // not needed if the href is '#live' 
}); 

您可以輕鬆地測試了它的存在，並採取相應的行動基於它的價值時，頁面加載，如：

$(document).ready(function() { 
    var hashVal = window.location.hash.split("#")[1]; 
    if(hashVal == 'live') { 
     $("#live").show(); 
    } 
}); 

Answer 2

如果您有類似這樣的標記：

<a href="#div5" class="toggler">Toggle Div 5</a> 
<div id="div5">Content for Div 5</div> 

你可以做T他在jQuery的：

$("a.toggler").click(function() { 
    $(this.hash).slideToggle(); 
}); 

或者使用rel或一個div東西，你點擊，這樣的：

<div rel="#div5" class="toggler">Toggle Div 5</a> 
<div id="div5">Content for Div 5</div> 

，並調整了jQuery這樣的：

$("div.toggler").click(function() { 
    var hash = $(this).attr("rel"); 
    $(hash).slideToggle(); 
    window.location.hash = hash; 
}); 

我的建議要在錨點上使用display:block;來做你想做的事情，並利用默認的瀏覽器行爲，它會在點擊時處理散列。

無論哪個上面的方法，你可以顯示像這樣在頁面加載的一個：

$(function() { 
    if(location.hash != "") { 
    $(location.hash + ":hidden").slideDown(); 
    } 
});