Проблема аккордеона jQuery с разметкой шаблона

У меня небольшая проблема с этим скриптом аккордеона.

И я знаю, почему это происходит, но я не могу это исправить. И я не уверен, что это можно исправить?

Сценарий аккордеона, который я использую, очень прост в реализации. http://www.i-marco.nl/weblog/jquery-accordion-menu/

Разметка для этого аккордеона проста и смысловая.

<ul class="menu">

    <li>
        <a href="#">Link</a>
        <ul class="acitem">
            <li><a href="http://www.pivotx.net/">PivotX</a></li>
            <li><a href="http://www.wordpress.org/">WordPress</a></li>
            <li><a href="#four">four</a></li>
            <li><a href="http://www.textpattern.com/">Textpattern</a></li>
            <li><a href="http://typosphere.org/">Typo</a></li>
        </ul>
    </li>

    <li>
        <a href="#">Weblog Tools</a>
        <ul class="acitem">
            <li><a href="http://www.pivotx.net/">PivotX</a></li>
            <li><a href="http://www.wordpress.org/">WordPress</a></li>
            <li><a href="#four">four</a></li>
            <li><a href="http://www.textpattern.com/">Textpattern</a></li>
            <li><a href="http://typosphere.org/">Typo</a></li>
        </ul>
    </li>

    <!-- and so fourth -->

</ul>

Это стиль разметки, для работы с которым предназначен сценарий. И это работает, см. здесь... http://jsfiddle.net/motocomdigital/CzZqZ/1/< /а>

Но моя проблема в том, что я работаю с шаблоном, разметку которого я не могу изменить, см. мою результирующую разметку ниже.

<ul class="menu">

    <ul>
        <li>
            <a href="#">Link</a>
            <ul class="acitem">
                    <li><a href="http://www.pivotx.net/">PivotX</a></li>
                    <li><a href="http://www.wordpress.org/">WordPress</a></li>
                    <li><a href="#four">four</a></li>
                    <li><a href="http://www.textpattern.com/">Textpattern</a></li>
                    <li><a href="http://typosphere.org/">Typo</a></li>
            </ul>
        </li>
    </ul>

    <ul>
        <li>
            <a href="#">Weblog Tools</a>
            <ul class="acitem">
                    <li><a href="http://www.pivotx.net/">PivotX</a></li>
                    <li><a href="http://www.wordpress.org/">WordPress</a></li>
                    <li><a href="#four">four</a></li>
                    <li><a href="http://www.textpattern.com/">Textpattern</a></li>
                    <li><a href="http://typosphere.org/">Typo</a></li>
            </ul>
        </li>
    </ul>

</ul>

Это наценка, которая выводится, что глупо.

Выдает больше, чем нужно.

Я создал скрипт js для приведенной выше разметки, чтобы вы могли видеть, что происходит http://jsfiddle.net/motocomdigital/CzZqZ/2/

Он не закрывает другие, когда открывается новый...

Кто-нибудь знает, как исправить скрипт, чтобы он работал как первый jsfiddle, но с сумасшедшей разметкой выше?

Большое спасибо, если кто-то может помочь.

Джош


javascript jquery jquery-ui-accordion
person Joshc    schedule 22.12.2011    source источник
comment
Похоже, это не работает даже с допустимой разметкой, jsfiddle.net/CzZqZ/8.   -  person Kevin B    schedule 22.12.2011
comment
почему ул в ул, а не в ли????   -  person    schedule 22.12.2011
comment
@KevinB отлично работает для меня, проверено в Firefox и Chrome.   -  person Viruzzo    schedule 22.12.2011

Ответы (2)


arrow_upward
1
arrow_downward

Внутри обработчика кликов измените на: var parent = this.parentNode.parentNode.parentNode;. С этим он работает как другой пример, который вы опубликовали.

person Viruzzo    schedule 22.12.2011
comment
jsfiddle.net/CzZqZ/9 — выполнялось тестирование, пока вы публиковали. ;-) Мне тоже нравится. - person Greg Pettit; 22.12.2011
comment
Извините, пришлось ждать 7 минут, так как на него ответили так быстро - отвлеклись! Спасибо - person Joshc; 22.12.2011

arrow_upward
0
arrow_downward

Добавьте класс «noaccordian» к вашим элементам «ul», которые вы хотите развернуть/свернуть.

Пример:

<ul class="menu">
    <ul class="noaccordion">
        <li>
            <a href="#">Click Here</a>
            <ul class="acitem">
person Jim Ecker    schedule 22.12.2011