Используйте JQuery для сохранения активной под-навигации открытой при загрузке новой страницы

Question

Я построил боковую панель навигации, которая сворачивается и раскрывается при щелчке по заголовкам навигации. все это прекрасно работает. однако если я разверну / открою одну из групп навигации и нажму, чтобы перейти на страницу, при загрузке новой страницы все группы навигации снова закроются. Я хотел бы найти способ, чтобы активная навигационная группа оставалась открытой.

Вот что я использовал для свертывания / расширения: (в настоящее время он настроен так, что одновременно может быть открыта только одна из групп навигации)

/* Collapse and Expand */
$(".slideTitle").click(function() {
    $(".indexListOpen").removeClass("indexListOpen").addClass("indexList");
    $(this).next().toggleClass("indexList").toggleClass("indexListOpen");
});

И это то, что я пытался использовать, чтобы сохранить текущую навигационную группу открытой при загрузке новой страницы:

/* keep current nav group open */
var path = location.pathname;
$('.indexListOpen a[@href$="' + path + '"]').addClass("selected");
$(".selected").parent().parent().removeClass("indexList").addClass("indexListOpen");

Не работает ... так что я уверен, что делаю много неправильно. Страница, над которой я работаю, находится по адресу instarservices.com/commercial

.

Любая помощь приветствуется !!!

Answer 1

Как сказал dcneiner, @ устарел в последней версии jQuery. Но похоже, что вы нацелены на indexListOpen, который не существует при загрузке новой страницы. Так что либо удалите это, либо измените на indexList, и оно должно работать

$('a[href$="' + path + '"]').addClass("selected");

или

$('.indexList a[href$="' + path + '"]').addClass("selected");

Answer 2

Если вы используете jQuery 1.3 или новее (точечная версия), селекторы атрибутов не могут быть вызваны с символом @. Кроме того, наличие начального слеша может вызвать проблемы. Поэтому я бы порекомендовал сделать это:

var path = location.pathname.replace(/(^\/)/g,''); // Removes the opening slash if present
$('.indexListOpen a[href$=' + path + ']').addClass("selected");

Если вы столкнулись с различиями в браузере (работает в некоторых, а не в других), проверьте три вещи:

1. Вам может потребоваться экранировать символ /, прежде чем использовать его в селекторе jQuery
2. Возможно, вы получаете косую черту в pathname, которой нет в конце ваших селекторов
3. На большинстве серверов Windows URL-адреса не чувствительны к регистру. Вы захотите добавить .toLowerCase() в конец оператора path = location ... и убедиться, что все ваши атрибуты href в нижнем регистре.

Удачи, и если эти предложения не сработают, попробуйте опубликовать свой HTML-код для своей навигации, чтобы помочь нам устранить его далее.