11.4.1 select和option
HTML支持具有选择功能的<select>标签。选择功能方便了用户在多个选项中进行选择,提高了窗口区域的利用率。通过对<select>标签的属性size的值进行设置,可产生不同的列表形式,如列表和下拉菜单。对属性multiple进行设置,可以同时选择多个列表项。<select>标签是定义一个列表结构的标签,列表中的列表项(或称菜单项)是真正被选择的对象,对它的定义要用<option>标签。因此,设置一个列表,要同时使用<select>和<option>标签。
<select>标签的语法为:
其中:
(1)class、id、name、style属性的含义与前面所介绍的标签的属性含义相同。
(2)size属性用于设置显示列表项的个数,缺省值为1,这时为下拉列表;当size值大于1,而小于列表项数时,列表是滚动列表;当size值大于列表项数时,列表所有的项被显示,这时列表是一个菜单。
(3)当使用multiple属性时,允许用户同时选择多个列表项。
(4)<select>标签是一个容器标签,它所包含的内容为<option>标签。在HTML文档中真正使用列表时,需要用<option>标签来定义列表项。
<option>标签的语法为:
其中:
(1)value是列表项的设定值。当选择了这一列表项,则表单将它的值提交。
(2)selected属性指定该列表项被选取,默认列表中的第一个列表项被选取。当<select>标签中使用了multiple属性时,则selected可被多个列表项使用,否则只能被一个列表项使用。
(3)disabled属性可使一个选项不可用。
注意:<option>标签只能用在<select>标签的内部。
下拉列表框实例代码如下:
这是指定了被选择为第二个列表项“HTML与XML”的选择框,运行结果如图11-13所示。
图11-13 下拉列表框实例
如果使用了multiple属性,列表项“HTML与XML”“网络工程基础”都可以使用selected属性,这两个列表项被指定在默认情况下被选中。
多选项表框实例代码如下:
运行结果如图11-14所示。
图11-14 多选项表框实例