10

我不知道如何做到这一点,或者如果我能做到这一点。我有一个 jQuery UI Accordion,多个部分,每个部分包含多个锚标记,每个标记都有一个唯一的字符串 id。

我希望能够将手风琴打开到具有给定 id 的特定元素所在的位置。就像说 id "item117"。我可以使用类似的东西吗

$('#accordion').activate('activate','#item117');

甚至

$('#accordion').activate('activate',117);

我已经尝试过这些和一些变化,但无法实现。在我试图开始工作的情况下,手风琴应该已经打开到第二部分的末尾。


我仍然没有得到这个,所以也许我做错了什么。我已经将它剥离为一个示例页面:http ://www.ofthejungle.com/testaccordion.php 请查看它及其来源。

4

13 回答 13

12

也已经解决了这个问题并找到了很好的通用解决方案
-模拟通过其 id 单击所需项目的标题

$('#header-of-item-258').click(); 

随时随地都可以使用,而不仅仅是手风琴

于 2011-09-07T11:08:13.950 回答
12

从文档:

// getter
var active = $( ".selector" ).accordion( "option", "active" );

// setter
$( ".selector" ).accordion( "option", "active", 2 );
于 2013-01-31T16:41:17.107 回答
10

对我来说工作

$("#accordion").accordion({active:"h3:last"})
于 2011-06-12T11:25:02.703 回答
9

您需要使用以下函数调用它accordion

// Open the third set (zero based index)
$('#accordion').accordion('activate', 2); 

要打开包含特定元素的部分,您可以执行以下操作。注意:您需要针对通常打开和关闭该部分的触发器。在文档中这是一个h3元素,您的触发元素可能不同,因此请相应地进行更改。

$('#accordion').accordion('activate', '#accordion > div:has(#item117) > h3'); 
于 2009-12-14T07:04:13.027 回答
9

这终于对我有用:

$("#accordion").accordion("activate", $("#h3-id"));

笔记!!!id 必须是您要打开的 <h3> 元素的 id(在默认手风琴设置中)。

于 2011-03-21T19:06:36.970 回答
3

我在用#id 激活手风琴时遇到了同样的问题。可悲的是,我还没有找到解决方法,所以我创建了一个 hack。我遍历div手风琴中的元素以获得有趣的索引div。它看起来像这样:

acc = 'tab-you-are-interested-in';

// find corresponding accordion
act = 0;
panels = $('#accordion-element > div');
for (i=0; i<panels.length; i++) {
    if ( panels[i].id == acc ) {
        act = i;  
    }
}

$('#accordion-element').accordion('activate', act);
于 2010-09-24T10:55:59.833 回答
2

当您单击标题时,它是 h3 元素,它会打开下一个 div ..这是功能。现在,对于 activate ,您需要提供索引或元素。index 可能与您的 id 不同。所以我会使用:

$('.selector').accordion('option', 'activate', $(h3#id));

如果你有索引,你可以使用它..但是大多数情况下,如果你动态创建手风琴,那么获得一个 id 的索引并不容易。你可以找到这样的索引..

 var processingHeaders = $('#accordion h3');
 for (i = 0; i < processingHeaders.length; i++) {

        ids.push($(processingHeaders[i]).attr('id'));
        idsForLaterChecks.push($(processingHeaders[i]).attr('id')); 
    }

现在我得到了 ids .. 使用 indexOf :在数组中找到索引并使用它..

注意: // idsForLaterChecks 是全局的

于 2012-07-11T17:32:10.283 回答
1

使用 jQuery 1.9+:

$('#accordion').activate('activate', elementSelector);

就是现在:

$('#accordion').activate('option', 'active', elementSelector);

如果您发现使用遍历方法更容易,如果您有这样的 HTML:

<div id="accordion">
    <h3><a href="#">Section</a></h3>
    <div>
        <p id="#item117" class="item">
            <a class="link-active" href="">Item 117</a>
        </p>            
    </div>
</div>

尝试这个:

var myh3 = $('#item117').parent().prev('h3');
$('#accordion').accordion('option', 'active', myh3);
于 2013-06-04T19:34:22.840 回答
0

您还可以像这样启用和禁用手风琴:

// Add the class ui-state-disabled to the headers that you want disabled
$( ".whatyouwantdisabled" ).addClass("ui-state-disabled");

要重新激活选项卡:

// Remove the class ui-state-disabled to the headers that you want to enable
$( ".whatyouwantenabled" ).removeClass("ui-state-disabled");
于 2011-07-29T23:34:20.180 回答
0

这是另一种方式。

仅在手风琴的每个 H3 标头标签中包含一个 ID="someId" 并将该 ID 命名为唯一的。

例如,此 id 将在系列“AccjA”中,下一个 h4 将是“AccjB”:

<h4 class="Accj" id="AccjA">
       <a href="#settings">A Fan?</a>
</h4>

然后激活您希望使用的任何面板:

    $('#Accjoin').accordion('activate', '#AccjoinA')

在页面加载后使用 Ben Alman 的“.doTimeout”函数延迟 2 秒后,我在超时时使用了上述内容来吸引用户的注意力,例如:

$.doTimeout(2000, function () {
    $('#Accjoin').accordion('activate', '#AccjoinA')
});
于 2012-08-26T08:50:15.133 回答
0

尝试

$('#accordion').activate('#item117');

或者

$('#accordion').activate(document.getElementById('item117'));

激活手风琴的正确语法是

$(".selector").activate(var index)

其中索引是字符串、元素、布尔值、数字、JQuery

于 2009-12-14T07:03:36.060 回答
-1

什么jquery API

激活 Accordion 中包含的第二个内容。

$(".selector").activate(1)

关闭手风琴的所有内容部分。

$(".selector").activate(false)

激活与给定表达式匹配的第一个元素。

$(".selector").activate("a:first")
于 2012-10-10T00:21:58.320 回答
-2
$('#collapseOne').collapse('toggle');
于 2015-12-30T01:10:35.180 回答