使用datalist分组输入

时间:2015-10-23 20:34:38

标签: html select datalist

我选择两种方式:

  1. 禁用选项。
  2. 使用optgroup标记。
  3. <select name="curso1" id="curso1">
        <option disabled="" style="font-size:12px; text-align:left; font-family:Arial Black">Group</option>
        <option value="1">Windows 8</option>
        <option value="8">lalalala</option>
    </select>
    <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>

    如何在数据列表中执行此操作?

    如何与datalist组合?

1 个答案:

答案 0 :(得分:3)

这在Chrome上看起来很整洁,但我不知道它将如何在其他浏览器中呈现。

enter image description here

&#13;
&#13;
<label>Choose a browser from this list:
<input list="browsers" name="myBrowser" /></label>
<datalist id="browsers">
  <option value="Brave">GroupA</option>
  <option value="Firefox"></option>
  <option value="Safari"></option>
  <option value="Opera">GroupB</option>
  <option value="Internet Explorer"></option>
  <option value="Microsoft Edge"></option>
</datalist>
&#13;
&#13;
&#13;