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

如果您使用的是jQuery 1.3或更新版本（点版本），则无法使用@符号调用属性选择器。另外，起始斜线的存在可能引起问题。所以我建议这样做：

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

如果您遇到浏览器差异（在某些情况下工作，而在另一部分工作），请检查三件事：

在jQuery选择器

/

您可能会在选择器末尾没有的pathname中显示一个尾部斜杠
在大多数Windows服务器上，url不区分大小写。您需要将.toLowerCase()添加到path = location ...语句的末尾，并确保href属性均为小写。

祝您好运，如果这些建议不起作用，请尝试发布您的导航HTML，以帮助我们进一步排查问题。

Answer 2

正如dcneiner所说，@已在最新版本的jQuery中弃用。但看起来您的目标是在新页面加载时不存在的indexListOpen。因此，要么删除它，要么将其更改为indexList，它应该可以正常工作

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

或

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

使用JQuery在加载新页面时保持活动的子导航打开

2 个答案: