菜单树在下拉/选择框内

Question

有没有办法在下拉列表/选择框中包含treemenu。我有类别列表，如

<ul id="example">
<li>Category1
    <ul>
        <li><a href="http://www.autisticcuckoo.net">Category1 subcat1</a></li>
        <li><a href="http://www.zeldman.com">Category1 subcat2</a></li>
        <li><a href="http://www.meyerweb.com">Category1 subcat3</a></li>
    </ul>
</li>
<li>Other Sites
    <ul>
        <li><a href="http://www.accessify.com/">Category2</a></li>
        <li><a href="http://www.w3.org/">Category3</a>
            <ul>
                <li><a href="http://validator.w3.org/">Category3 subcat1</a></li>
                <li><a href="http://jigsaw.w3.org/css-validator/">Category3 subcat2</a></li>
                <li><a href="http://www.w3.org/TR/WAI-WEBCONTENT/">Category3 subcat3</a></li>
            </ul>
        </li>
    </ul>
</li>

我希望我的类别列表如树状菜单。 http://mackpexton.com/projects/TreeMenu/index.htm 现在使用jquery选择显示选择框。有没有办法做到这一点？

Answer 1

你不能在选择框内做到这一点。不过你可以假装它。使用selectbox和ul列表和按钮创建一个容器，它将在单击时显示它。然后在单击列表中的任何项目后，您应该将单击的项目映射到选择框中的特定项目，并更新触发下拉列表的可见按钮的值。

Answer 2

你使事情变得复杂。为什么有人想在选择列表中包含分层菜单。选择列表旨在显示项目列表。你怎么知道你从树状菜单中选择了哪个项目。 （我的意思是你怎么知道选定的项目路径）。

如果你可以找到一个例子（用法），也许可以帮助你。

我上传了一张图片..这就是你想要实现的目标

这就是所谓的树状菜单。

第二张图片来自jquery选择的网站。如果这是你想要的

你可以轻松实现这一目标。

<select>
        <optgroup label="fruits">
            <option>Apple</option>
            <option>Apple</option>
            <option>Apple</option>
        </optgroup>
        <optgroup label="fruits">
            <option>Apple</option>
            <option>Apple</option>
            <option>Apple</option>
        </optgroup>
        <optgroup label="fruits">
            <option>Apple</option>
            <option>Apple</option>
            <option>Apple</option>
        </optgroup>
    </select>