使用多个标题下拉(组合框)

Question

是否有任何小部件或代码可以使用HTML/CSS/JQuery创建一个可以有多个标题的下拉框(HTML选择标记)？标题不应该是可选的.例如,请参见此图片中的"苹果"下拉框:

不幸的是,很难找到这样的东西.我觉得我正在重新设计以前做过的东西,但我无法在任何地方找到它.无论如何,如果没有人能找到它我将自己创建它.关于如何创建它的任何想法都是受欢迎的,但我确信它将涉及div,Jquery显示/隐藏,以及CSS用于边框/项目.

Answer 1

我认为您正在寻找选择中的optgroup标签,请参阅此处的示例

http://www.w3schools.com/tags/tag_optgroup.asp

这里有点小提琴

http://jsfiddle.net/sushilbharwani/Xp8YK/

<select name="catsndogs">
    <optgroup label="Cats">
        <option>Tiger</option>
        <option>Leopard</option>
        <option>Lynx</option>
    </optgroup>
    <optgroup label="Dogs">
        <option>Grey Wolf</option>
        <option>Red Fox</option>
        <option>Fennec</option>
    </optgroup>
</select>