jQuery Accordion - открыть определенный раздел при загрузке страницы

У меня есть довольно простая реализация jQuery Accordion на странице (с использованием 1.3.2, jQuery UI Core 1.72 и jQuery UI Accordion 1.7.2), и я хочу открыть второй раздел при загрузке страницы. Я пробовал множество методов, но ничего не работает...

ЗАГОЛОВНОЙ СЦЕНАРИЙ:

<script type="text/javascript"> $(function() {
    $("#accordion").accordion({
        event: "mouseover"
    });

});

BODY ACCORDION:

<div id="accordion">
<h3><a href="#">Headline 001</a></h3>
<div>
<ul>
     <li><a href="#1">Link 001</a></li>
     <li><a href="#2">Link 002</a></li>
     </ul>
</div>
<h3><a href="#">Headline 002</a></h3>
<div>
     <ul>
    <li><a href="#3">Link 003</a></li>
     <li><a href="#4">Link 004</a></li>
     </ul>
</div>

Any help would be greatly appreciated!


javascript jquery accordion
person Bomski    schedule 04.02.2010    source источник
comment
Не уверен насчет времени, когда это было сделано, но индекс активации основан на 0, поэтому для этого вопроса пользователь будет использовать active: 1   -  person xdumaine    schedule 22.07.2011

Ответы (7)


arrow_upward
21
arrow_downward 

$("#accordion").accordion({ active: 2, event: "mouseover" });

Должен сделать трюк!

ОБНОВИТЬ

если не получится, попробуй

$("#accordion").accordion({  event: "mouseover" }).activate(2);

(N.B. это обновлено, чтобы быть немного быстрее, спасибо за комментарии. Честно говоря, это должно работать с параметром «active: 2», не знаю, почему это не так.)

person Ed James    schedule 04.02.2010
comment
это просто заставляет аккордеон открывать оба сегмента! я что-то пропустил?? ‹script type=text/javascript› $(#accordion).accordion({ active: 2, event: mouseover }); ‹/скрипт› - person Bomski; 04.02.2010
comment
Странно, аккордеоны не предназначены для открытия более одного предмета одновременно! - person Ed James; 04.02.2010
comment
я знаю... теперь это вообще не работает... должно быть что-то не так с javascript; - person Bomski; 04.02.2010
comment
обновление работает, но закрывает все аккордеоны....! изменил индекс на 0 и разрешил .... большое спасибо! - person Bomski; 04.02.2010
comment
Обновление не очень медленное? Например, вы подключаете аккордеон в первый раз, а затем снова запускаете все это, чтобы активировать индекс. Кроме того, ответ Дармена будет намного быстрее после того, как вы просто создадите его, то есть: $('#accordion').accordion({ event: "mouseover"}).activate(2) - person Adhip Gupta; 04.02.2010
comment
Это было бы медленнее, чем просто вызов метода activate. - person Darmen Amanbayev; 04.02.2010
comment
Я не использую аккордеон JQuery, но что-то подобное. Не могли бы вы помочь: stackoverflow. ком/вопросы/2199716/ - person Si8; 29.09.2015

arrow_upward
10
arrow_downward

правильный способ открыть определенную вкладку:

$("#accordion").accordion({
    collapsible  : true,
    active       : false,
    heightStyle  : "content",
    navigation   : true
});

Установите параметр:

//$("#accordion").accordion('option', 'active' , "INSERT YOUR TAB INDEX HERE");
$("#accordion").accordion('option', 'active' , 1);

или вы можете работать с таким хешем:

if(location.hash){

    var tabIndex = parseInt(window.location.hash.substring(1));     
    $("#accordion").accordion('option', 'active' , tabIndex);

}

Голосуйте, если используете ;)

Спасибо

person Martijn van Hoof    schedule 19.04.2013

arrow_upward
8
arrow_downward

Работает ли следующее?

$(function() {
    $("#accordion").accordion({
        event: "mouseover",
        collapsible: true,
        active: 2
    });

});
person Adhip Gupta    schedule 04.02.2010
comment
Мне нравится этот ответ, потому что он демонстрирует использование в несколько более сложных ситуациях. - person Buttle Butkus; 11.12.2013

arrow_upward
3
arrow_downward

Пытаться

$("#accordion").activate(index);
person Darmen Amanbayev    schedule 04.02.2010

arrow_upward
1
arrow_downward

Я решил этот вопрос немного по-другому, так как мне пришлось создать menu.php, который мы включили, я включил каждую страницу. В нашем проекте была 1 гармошка (элемент меню с 2 подменю). Таким образом, когда посетитель находится в подменю, аккордеон открыт, а выбранная ссылка (выделенная с помощью CSS, а не jQuery) активна. Но когда посетитель находится на другой странице, аккордеон работает нормально.

Вот javascript:

var containsParams = /teacher|student/i.test(window.location.href), //regexp with string params
accordion = $("li.accordion"); // the accordion as a global

accordion.accordion({ //accordion setup on every page
    animated : !containsParams,
    active : containsParams,
    collapsible : true,
    event : "click",
    header : "h2"
});

//I like to use "self calling methods" since many times I need a main onload event and this way it's clear for every page and my main function still remains
(function () {
    if (containsParams) accordion.accordion("activate", 0);
})();

Надеюсь, вам понравится. знак равно

С наилучшими пожеланиями! знак равно

person benqus    schedule 09.02.2012

arrow_upward
0
arrow_downward

Вы должны писать active: 1 вместо 2, потому что Accordion индексирует секции с 0, а не с единицы. Рабочий код будет выглядеть так:

$("#accordion").accordion({ active: 1, event: "mouseover" });

Надеюсь, это немного поможет.

person swilgosz    schedule 08.06.2014

arrow_upward
0
arrow_downward

Как уже упоминалось, следующее сделает его активным при открытии:

$("#accordion").accordion({ active: 1 });

Это active:1, так как это 2-й индекс аккордеона {0,1,2,...}; Кажется, в других ответах есть некоторая путаница, поскольку содержимое элемента содержит символ "2"...

person THOMAS MANN    schedule 18.05.2015