html表单选项菜单option与optgruop标签的用法详解

黄舟
发布: 2017-07-03 09:38:19
原创
5561 人浏览过

使用option标签可以定义一个标签的菜单或是滚动列表中的一个元素显示,这样,其内容只能是纯文本,不能有任何装饰。
value属性

使用value属性可以为每个选项设置一个值,当用户选中该选项时.浏览器会将其发送给服务器。如果还没有指定value属性,选项的值将被设置为

coption value=dog>dog <option>dog
登录后复制

这两者具有同样的值。第一个是输出在

selected属性

默认情况下,所有多选的标签会预先选中第一选项。

label属性

通常情况下,在将元素显示给用户时,会用

标签

表单中的选项菜单有可能非常长,这使得它们很难显示和使用。在这种情况下,将一些相关的选项分组会很有帮助,然后将这些组作为一组嵌套的层叠式菜单呈现给用户。在HTML 4.0中是新引人的标签,虽然使用方式有限,但是它为HTML和XHTML的表单提供了这种功能。

只能在主菜单中的每个标签都生成子菜单。例如,在HTML中,可以利用来显示一个表单菜单,该菜单是按地名排列!

<select name=state>
 <optgroup label=龙岗区>
      <option>布吉镇
      <option>坂田镇
</optgroup>
<optgroup label=宝安区>
      <option>龙华镇
      <option>西乡镇
</optgroup>
</select>
登录后复制

1694.png

由于还没有浏览器能够完全支持标签(一般浏览器会简单地将它们显示为滚动菜单),我们无法向读者展示这样的菜单是什么样子。但是,它们可能和我们所熟悉的下拉菜单非常相似,对大多数图形化用户界面来说,下拉菜单是很普遍

的功能。当用鼠标或键盘选定后,会通向一个或多个菜单。例如,在我们关于“州(state )”的示例中,可能会有标记为“Northeast" , "South”这样的子菜单,拉开每个子菜单都会显示其所包含的州名列表。

可惜的是,标签最大的障碍是它无法嵌套,这样就限制了只能有一层子菜单。但是在XHTML将来的版本中,有可能会突破这个限制。使用label属性可以定义一个