JQuery UI Аккордеон "навигация: истина" не удалось на вложенном <ul>

Question

Я создаю Аккордеонное Меню, используя jQuery UI. Но мне кажется, что установщик navigation: true не работает для вложенного тега <ul>.

navigation: true работает для Header A -> Link 1, Header B -> Link 2, но не для anything in subHeader under Header B (Link 3, Link 4).

Могу ли я знать, если я использую неправильную структуру, чтобы Аккордеон не функционировал как указано? Спасибо!

Вот jQuery:

<script type="text/javascript">
$(document).ready(function() {
    $("#accordion").accordion({
        navigation: true,
        active: false,
        header: &#039;h3&#039;,
        collapsible: true
    });
});
</script>

Вот структура HTML:

Заголовок A

• Ссылка 1

Заголовок B

• Ссылка 2
• подзаголовок A
  • Ссылка 3
  подзаголовок B
  • Ссылка 4

<div id="accordion">
 <h3>Header A</h3>
 <ul>
  <li><a href="#">Link 1</a></li>
 </ul>

 <h3>Header B</h3>
    <ul>
        <li><a href="#">Link 2</a></li>
        <li>
         <h4>subHeader A</h4>
                <ul>
                    <li>
                        <a href="#">Link 3</a>
                    </li>
                </ul>
         <h4>subHeader B</h4>
                <ul>
                    <li>
                        <a href="#">Link 4</a>
                    </li>
                </ul>   
            </li>
       </ul>

</div>

Answer 1

Возможно, эта проблема / ответ - то, что вы ищете :)
Вложенное меню аккордеона в jQuery