jQuery UI Akkordeon aktivieren

Question

Ich bekomme nicht, wie das geht, oder wenn ich das tun kann. Ich habe ein jQuery UI Accordion, mehrere Abschnitte, wobei jeder Abschnitt mehrere Anchor-Tags mit jeweils einer eindeutigen String-ID enthält.

Ich möchte in der Lage sein, das Akkordeon zu öffnen, wo ein bestimmtes Element mit einer bestimmten ID ist. Wie sagen ID "item117". Kann ich so etwas wie

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

oder sogar

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

Ich habe diese und einige Varianten ausprobiert, sondern können ihn nicht bekommen zu gehen. In dem Fall, in dem ich versuchte zu arbeiten, sollte sich das Akkordeon bis zum Ende des zweiten Abschnitts geöffnet haben.

---

Ich bekomme immer noch nicht, also vielleicht mache ich auch etwas anderes falsch. Ich habe es hier auf eine Beispielseite reduziert: http://www.ofthejungle.com/testaccordion.php Bitte sehen Sie es sich und seine Quelle an.

Answer 1

Versuchen

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

oder

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

die korrekte Syntax für ein Akkordeon aktivierende

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

wobei der Index ist String, Element, boolean, Zahl, JQuery

Answer 2

Sie müssen es anrufen mit der Funktion accordion genannt:

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

einen Ausschnitt öffnen ein bestimmtes Element enthält, würden Sie etwas tun. Hinweis: Sie müssen auf den Auslöser zielen, der normalerweise den Abschnitt öffnet und schließt. In der Dokumentation ist dies ein h3 Element, Ihr Trigger-Element kann anders sein, also ändern Sie dies entsprechend.

$('#accordion').accordion('activate', '#accordion > div:has(#item117) > h3'); 

Answer 3

hatte ich das gleiche Problem mit einem Akkordeon mit #id aktivieren. Leider hatte ich keinen Weg gefunden, also habe ich einen Hack erstellt. Ich durchlaufen div Elemente in meinem Akkordeon, um den Index interessant div zu bekommen. Es sieht wie folgt aus:

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); 

Answer 4

Diese ENDLICH für mich gearbeitet:

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

HINWEIS !!! Die ID hat, dass der <h3> Element sein, das Sie (im Standard-Akkordeon-Setup) öffnen wollen.

Answer 5

für mich gearbeitet

$("#accordion").accordion({active:"h3:last"}) 

Answer 6

Sie können auch das Akkordeon wie folgt aktivieren und deaktivieren:

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

die Registerkarte wieder zu aktivieren:

// Remove the class ui-state-disabled to the headers that you want to enable 
$(".whatyouwantenabled").removeClass("ui-state-disabled"); 

Answer 7

haben über diese auch schon & gefunden schöne und universelle Lösung
- emulieren den Header gewünschte Element durch seine ID

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

klicken, die jedes Mal funktioniert und überall nicht nur Akkordeon

Answer 8

Wenn Sie auf Kopf klicken, ist es h3 Element und es öffnet sich das nächste div..that ist Funktionalität. Jetzt müssen Sie für activate den Index oder das Element angeben. Der Index könnte sich von Ihrer ID unterscheiden. so würde ich verwenden:

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

Wenn Sie Index haben, können Sie den meisten Fällen verwenden that..But, wenn Sie Akkordeon dynamisch erstellt, es ist nicht leicht Index einer ID zu bekommen. Sie können Indizes wie diese finden ..

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

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

jetzt i ids bekam .. indexOf mit: den Index im Array finden und es verwenden ..

Hinweis: // idsForLaterChecks global ist

Answer 9

Hier ist ein anderer Weg.

Fügen Sie eine ID = "someId" nur in jedes der H3-Header-Tags des Akkordeons ein und benennen Sie die IDs eindeutig.

Zum Beispiel diese ID in Serie 'AccjA' die nächste h4 wäre 'AccjB' wäre:

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

Dann aktivieren Sie je nachdem, was Feld, das Sie wollen mit:

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

ich verwendet habe, das oben auf einer Zeitüberschreitung, um die Aufmerksamkeit des Benutzers zu erwischen, nachdem die Seite mit einer Verzögerung von 2 Sekunden geladen wurde, Ben Alman's ".doTimeout" -Funktion wie:

$.doTimeout(2000, function() { 
    $('#Accjoin').accordion('activate', '#AccjoinA') 
}); 

Answer 10

Whatch the jquery API

Aktivieren Sie den zweiten Inhalt des Akkordeons in.

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

Schließen Sie alle Inhaltsteile des Akkordeons.

Aktivieren Sie das erste Element, das dem angegebenen Ausdruck entspricht.

$(".selector").activate("a:first") 

Answer 11

Aus Dokumentation:

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

// setter 
$(".selector").accordion("option", "active", 2); 

Answer 12

Mit jQuery 1.9+ das:

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

ist jetzt:

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

Wenn Sie es einfacher zu bedienen durchqueren Methoden finden, Wenn Sie HTML so haben:

<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> 

versuchen Sie dies:

var myh3 = $('#item117').parent().prev('h3'); 
$('#accordion').accordion('option', 'active', myh3); 

Answer 13

$('#collapseOne').collapse('toggle');