Используйте привязку для отображения отделения
Я использую jQuery и потребность выполнить пару вещей.
1) Когда кто-то нажимает на ссылку (или в моем случае, отделении) для отображения другого отделения, я хотел бы добавить привязку к URL.
Так, если кто-то нажимает на ссылку "Live", 'живое' отделение скатывается, и мы добавляем #live к URL.
2) Если кто-то посещает ту страницу и сохраняет #live привязку в конце URL, то 'живое' отделение должно быть видимо сразу же.
Я знаю, как обработать базовую деталь slideDown (), если кто-то нажимает отделение. Я не знаю, как добавить хэш-тег или сделать его так, чтобы, когда страница загружается, что хэш-тег проверяется и отображает соответствующее отделение.
Любая справка, понимая это ценилась бы.Заранее спасибо.
2 ответа
Добавить хэш к 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();
}
});
Если у вас была такая разметка:
<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();
}
});