Question

这里只是一个快速的，但仅限于jQuery专家。

让jQuery手风琴始终打开标题的最佳方法是什么，该标题包含当前用户所在页面的链接？

当前代码：

  $(function () {
        $('ul.drawers').accordion({
            header: 'H2.drawer-handle',
            selectedClass: 'open',
            collapsible: true,
            active: false,
            event: 'mouseover',
            navigation: true,
        });
});

$('ul.drawers').accordion('option', 'navigationFilter', function(){   
        //Your code for the NavigationFilter }); 
</script>

一切顺利，罗伯特

这是html：

<ul class="drawers"> 
<li class="drawer"> 
<h2 class="drawer-handle"><a class="lahtine" href="http://www.viking.ee/en/outwardwindows/">Outward Opening Windows</a></h2> 
<div class="menu-outward-opening-windows-container"><ul id="menu-outward-opening-windows" class="menu"><li id="menu-item-789" class="menu-item menu-item-type-post_type menu-item-789"><a href="http://www.viking.ee/en/windows/aluclad/">Aluminium Clad Wooden Windows</a></li> 
<li id="menu-item-790" class="menu-item menu-item-type-post_type menu-item-790"><a href="http://www.viking.ee/en/windows/doubleglazedwindow/">Double Glazed Window</a></li> 
<li id="menu-item-791" class="menu-item menu-item-type-post_type menu-item-791"><a href="http://www.viking.ee/en/windows/tripleglazing/">Energy Efficient Triple Glazed Window</a></li> 
<li id="menu-item-792" class="menu-item menu-item-type-post_type menu-item-792"><a href="http://www.viking.ee/en/windows/secure/">Secured By Design</a></li> 
</ul></div></li> 
<li class="drawer"> 
<h2 class="drawer-handle"><a href="http://www.viking.ee/en/inwardwindows/">Inward Opening Windows</a></h2> 
<div class="menu-inward-opening-windows-container"><ul id="menu-inward-opening-windows" class="menu"><li id="menu-item-793" class="menu-item menu-item-type-post_type menu-item-793"><a href="http://www.viking.ee/en/windows/woodenwindows/">Inward Opening Wooden Windows</a></li> 
<li id="menu-item-794" class="menu-item menu-item-type-post_type menu-item-794"><a href="http://www.viking.ee/en/windows/timberthermalwindow/">Timber Thermal Window</a></li> 
</ul></div></li> 
<li class="drawer"> 
<h2 class="drawer-handle"><a href="http://www.viking.ee/en/selection/">Additional Selection</a></h2> 
<div class="menu-additional-selection-container"><ul id="menu-additional-selection" class="menu"><li id="menu-item-795" class="menu-item menu-item-type-post_type menu-item-795"><a href="http://www.viking.ee/en/windows/fireguard/">Viking Fireguard Window</a></li> 
<li id="menu-item-796" class="menu-item menu-item-type-post_type menu-item-796"><a href="http://www.viking.ee/en/windows/slidingsash/">Traditional Sliding Sash</a></li> 
</ul></div></li> 
<li class="drawer"> 
<h2 class="drawer-handle"><a href="http://www.viking.ee/en/exteriordoors/">Exterior Doors</a></h2> 
<div class="menu-exterior-doors-2-container"><ul id="menu-exterior-doors-2" class="menu"><li id="menu-item-797" class="menu-item menu-item-type-post_type current-menu-item menu-item-797"><a href="http://www.viking.ee/en/doors/alucladdoors/">Viking Double Glazed Alu-Clad Door</a></li> 
<li id="menu-item-798" class="menu-item menu-item-type-post_type menu-item-798"><a href="http://www.viking.ee/en/doors/tripleglazed/">Energy Efficient Triple Glazed Wooden Doors</a></li> 
</ul></div></li> 
<li class="drawer last"> 
<h2 class="drawer-handle"><a href="http://www.viking.ee/en/slidingdoors/">Sliding/Folding Doors</a></h2> 
<div class="menu-sliding-and-folding-doors-container"><ul id="menu-sliding-and-folding-doors" class="menu"><li id="menu-item-799" class="menu-item menu-item-type-post_type menu-item-799"><a href="http://www.viking.ee/en/doors/sliding/">The Sliding Door</a></li> 
</ul></div></li> 
</ul>

Answer 1

没有看到其余的代码/ html，或者知道你专门使用哪种手风琴插件。

我想说最简单的方法是比较document.location.pathname（或者只是从filename解析它）然后你可以做几件事。

1）使用上面的函数运行一个函数，将所需的类添加到与当前位置匹配的项目（url），这样当初始化菜单时，它知道要扩展哪个

2）初始化菜单后运行一个函数，以检测哪个标题包含当前页面并触发事件以展开它。你在使用jQuery UI手风琴吗？如果是这样，语法是：

       `$(yourMenuSelector).accordion("activate",indexOfHeaderToOpen);`

如果能提供更多信息，很高兴能提供帮助，但这应该让车轮旋转。

jQuery Accordion navigationFilter打开当前页面的标题

1 个答案: