需要有关jQuery UI Accordion navigationFilter选项的帮助 [英] Need help with jQuery UI Accordion navigationFilter option

问题描述

我正在建造一个用于导航的手风琴.手风琴的每个部分都有一组链接.触发代码如下:

I'm building an accordion for navigation. Each section of the accordion has a set of links. The firing code looks like this:

$(document).ready(function() {
    $(".selector").accordion({
        collapsible: true,
        active: false,
        navigation: true
    });
});

在将每个集合中的链接之一编辑为指向单个文件(称为foo.html)之前，所有这些工作均正常且繁琐.因此，现在，如果您导航到foo.html，则location.href会匹配手风琴的每个部分(因为每个部分都有指向它的链接)，并且会打开所有部分，从而破坏了手风琴的用途.

This all worked fine and dandy until one of the links in each set was edited to point to a single file, call it foo.html. So now if you navigate to foo.html, the location.href matches every section of the accordion (since each section has a link to it) and that opens all the sections, defeating the purpose of the accordion.

因此，我很确定我需要使用navigationFilter选项，但是我已经用它搜索了地狱，并且还没有找到任何有关如何构建与之关联的功能的示例.

So I'm pretty sure I need to use the navigationFilter option but I've googled the living hell out of it and haven't found any examples of how to build the function associated with it.

帮我，堆栈溢出！

推荐答案

这是一个老问题，但是我今天遇到了同样的问题，所以我想我会为正在寻找的其他人回答.

This is an old question, but I struggled with this same issue today, so I thought I would answer this for anyone else who is looking.

我想使用手风琴导航过滤器根据路线中的最后一项进行匹配(使用ASP.NET-MVC2).我想出了以下解决方案.它不漂亮，但是可以用.

I wanted to use the accordion navigation filter to match based on the last item in my route (using ASP.NET-MVC2). I came up with the following solution. It is not pretty, but it works.

我的链接看起来像: http://site.com/Home/Details/IDSTRING

My links look like: http://site.com/Home/Details/IDSTRING

过滤器匹配以IDSTRING结尾的location.href.

The filter matches for any location.href that ends with IDSTRING.

您可能希望将位置解析代码移动到另一个位置，这样它在每次页面加载时仅运行一次，而不是对每个手风琴元素运行一次.

You would probably want to move the location parsing code into the another location so it only runs once per page load instead of once per accordion element.

$("#accordion").accordion({ animated: false, autoHeight: false, collapsible: true, navigation: true, navigationFilter: function () {
    //Accordion NavigationFilter
    var locationHrefArray = location.href.split("/");
    var locationLastString = locationHrefArray[locationHrefArray.length - 1].toLowerCase();

    var sidebarHrefArray = this.href.split("/");
    var sideBarLastString = sidebarHrefArray[sidebarHrefArray.length - 1].toLowerCase();

    return locationLastString  == sideBarLastString;
} });

这篇关于需要有关jQuery UI Accordion navigationFilter选项的帮助的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！