Javascript 如何使用jQuery mobile创建多级导航？

我一直在尝试使用jQuery mobile创建页面。 我正在尝试使用列表和可折叠文件创建导航菜单。 导航的工作方式是有链接和链接集合。 每个链接集合都放入一个可折叠列表中

以下是网页：

<div data-role="page">
<div data-role="content">
    <ul data-role="listview">
        <li> <a href="#">Link 1</a>

        </li>
        <li> <a href="#">Link 3</a>

        </li>
    </ul>
    <div data-role="collapsible" data-inset="false">
         <h3>Links inside</h3>

        <ul data-role="listview">
            <li><a href="#">link 5</a>
            </li>
            <li><a href="#">link 6</a>
            </li>
        </ul>
    </div>
    <ul data-role="listview">
        <li> <a href="#">Link 3</a>

        </li>
        <li> <a href="#">Link 4</a>

        </li>
    </ul>
</div>

内部链接

问题在于，将任何内容放在listview或Collapsable之后似乎都存在填充问题，并且稍微向上推到前面的元素中，覆盖了其中的一些内容

我试过使用
而且很清楚：两者都有

---

如果可能的话，我只想使用一个listview，而不是混合使用listview和Collapsable，但这对我来说不起作用。

将

data inset=“true”

添加到listview和Collapsables中。我正试图保持与我的主站点相似的外观，它没有圆角，并尝试填充整个屏幕，然后使用此CSS

.ui listview.ui可折叠{margin:1em 0！important；}

经过几次调整后，我得到了解决方案，谢谢，