jquery - 使用 jquery ui 手风琴向导航链接构建添加活动类

Question

更新：

尝试使用正则表达式作为 url 并且它有效：

var url = window.location.pathname, 
urlRegExp = new RegExp(url.replace(/\/$/,'') + "$");

$("#accordion a").each(function()
{
    if(urlRegExp.test(this.href.replace(/\/$/,'')))
    {
        $(this).addClass("active-sidebar-link");
    }
});

我正在使用 jQuery UI Accordion Widget 为我的网站构建侧边栏导航菜单。 http://jqueryui.com/demos/accordion/

我有以下代码：

// create accordion
$( "#accordion" ).accordion(
{
    header: '> li, h3:not(> li > ul)',
    collapsible: true,
    autoHeight: false,
    navigation:true 
});

// Add active class to active sidebar links
$("#accordion a").each(function() 
{
    if (this.href == window.location || this.href == document.location.protocol + "//" + window.location.hostname + window.location.pathname)
    {
        $(this).addClass("active-sidebar-link");
    }
});

手风琴有效，“navigation: true”选项也有效（http://jqueryui.com/demos/accordion/#option-navigation），它会根据您的链接打开相应的手风琴“抽屉”来访。

但是活动类没有被添加到当前链接。

有什么想法吗？

Answer 1

我会对 href 值执行搜索功能。如果您有多个页面的链接，那么您可以将代码进一步包括window.location.pathname，但这是搜索域名的良好开端：

$("#accordion a").each(function() 
{
    if (this.href.search(window.location.hostname) != -1)
    {
        $(this).addClass("active-sidebar-link");
    }
});​

或者，正如我在上面的评论中所说，您可能想要使用正则表达式。