有没有办法在<select>中包含一些文本(不是选项)?

use*_*900 1 html forms html5 html-select html4

我们在表格中选择了4个选项.我的客户希望以某种方式对选项进行分类,以便我们可以在顶部相关选项上添加一些文本.它看起来像:

<select>
   Cat 01
   <option value="Some Value">Some Option</option>
   <option value="Some Value">Some Option</option>
   Cat 02
   <option value="Some Value">Some Option</option>
   <option value="Some Value">Some Option</option>
</select>
Run Code Online (Sandbox Code Playgroud)

我知道上面不是有效的标记.我知道我可以将Cat01和Cat02作为没有值的选项,但我想知道是否有有效的代码或更合适的解决方法吗?

Tom*_*mer 7

我相信你需要的是optgroup:

<select>
  <optgroup label="Swedish Cars">
    <option value="volvo">Volvo</option>
    <option value="saab">Saab</option>
  </optgroup>
  <optgroup label="German Cars">
    <option value="mercedes">Mercedes</option>
    <option value="audi">Audi</option>
  </optgroup>
</select>
Run Code Online (Sandbox Code Playgroud)


Mur*_*bul 6

是肯定的

试试这个

<select>
   <optgroup label="Cat 01">
   <option value="Some Value">Some Option</option>
   <option value="Some Value">Some Option</option>
</optgroup>
      <optgroup label="Cat 02">
   <option value="Some Value">Some Option</option>
   <option value="Some Value">Some Option</option>
   <option value="Some Value">Some Option</option>
</optgroup>
</select>
Run Code Online (Sandbox Code Playgroud)