Question

我在一个站点中使用jQueryUI accordion小部件：

<ul id="accordion">
    <li id="tab1">
        <h2>title 1</h2>
        <div>text 1</p></div>
    </li>
    <li id="tab2">
        <h2>title 2</h2>
        <div>text 2</p></div>
    </li>
    <li id="tab3">
        <h2>title 3</h2>
        <div>text 3</p></div>
    </li>

    ....

</ul>


$('#accordion').accordion({
    heightStyle: 'content',
    animate: 100,
    collapsible: true,
});

我知道你可以使用active属性和从零开始的索引打开一个特定的选项卡。我想知道是否可以打开指定命名锚点的选项卡？类似的东西：

$('#accordion').accordion({
    heightStyle: 'content',
    animate: 100,
    collapsible: true,
    active: 'tab2'
});

我喜欢手风琴从外部链接打开，如下所示：

www.domain.com/page/#tab2

任何帮助将不胜感激

Answer 1

试试这个

jQuery(function() {
    jQuery( "#work" ).accordion({
    collapsible: true,
    active: "h3#id"
    });
});

从这里开始：Jquery Accordion, Set Active by ID

Answer 2

Demo

要正常激活标签，请使用此

$('#accordion').accordion({
    heightStyle: 'content',
    animate: 100,
    collapsible: true,
    active: '#tab2 h2'
});

根据您的要求，请尝试使用此工作代码段。

var url = window.location.href;

var tab = url.substr(url.lastIndexOf('/')+1);

$('#accordion').accordion({
    heightStyle: 'content',
    animate: 100,
    collapsible: true,
    active: tab+ ' h2'
});

您可以使用active : 'selector'将accordion设置为活动状态。这里的选择器是h2 - 具有Id -tab2的li的子项

打开带有命名锚点的手风琴选项卡

2 个答案:

Demo