Использовать привязку для отображения div

Question

Я использую jquery, и мне нужно выполнить пару вещей.

1) Когда кто-то нажимает на ссылку (или в моем случае, div), чтобы отобразить другой div, я бы хотел добавить привязку к URL-адресу.

Итак, если кто-то нажимает на ссылку «Живой», «живой» div сдвигается вниз, и мы добавляем #live к URL-адресу.

2) Если кто-то посещает эту страницу и держит якорь #live в конце URL-адреса, то «живой» div должен быть сразу виден.

Я знаю, как обращаться с основной частью slideDown(), если кто-то нажимает на div. Я не знаю, как добавить хэштег или сделать так, чтобы при загрузке страницы хештег был отмечен и отображает соответствующий 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> 

вы можете сделать т его в 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(); 
    } 
});