Навигация по блокам

Рейтинг: 0Ответов: 1Опубликовано: 09.11.2014

Всем привет. В очередной вечер я начинаю тупить, что даже не могу реализовать очевидное.

Есть 3 формы на одной странице: Вход/Регистрация/Восстановить. Мне необходимо скрывать формы по одной в зависимости от выбранной.

Изначально всё 

$('#forgot').hide();
$('#signup').hide();
$('#login').show();

При клике на "ссылку", к примеру, на app.com/#signup, появляется форма регистрации, все остальные скрываются, ну и так далее.

В общем, всё предельно просто, но у меня не получается и даже стыдно писать такие вопросы. :[

javascript jquery
Источник: Stack Overflow на русском

Ответы

▲ 1Принят
var unionSelector = '#forgot, #signup, #login';
var $forms = $(unionSelector);
window.addEventListener('hashchange', function () { // у jQuery, насколько знаю, нет обработчика hashchange в обычной версии
    $forms.each(function () {
        var $form = $(this);
        if ($form.is(location.hash)) {
            $form.show();
        } else {
            $form.hide();
        }
    });
}, false);

Обновление

`$('a[href="' + location.hash + '"]').addClass('active');

Сделайте для ссылок общий класс / роль, выбирайте их так же, и так же по ним проходить, сравнивая .attr('href') c location.hash. А еще лучше им задать какие-нибудь data-form-id="1" и искать по ним, в этом случае хэш вообще не будет нужен.

Обновление

$('li.active').removeClass('active');