您的位置：首页 > 其它

如何对select元素中的选项进行逻辑分组

2007-09-29 09:40 155 查看
不知道大家有没有这样的感觉，在select选项足够多的时候，被select中的选项弄得头昏眼花，想要找一个自己想要的选项实在是太困难了。

其实是可以对select里面的选项进行逻辑分组的。

可以想象得到，如果对select的选项进行了分组，这对于有大量选项的select肯定是有好处的。至少用户体验会好很多，方便大家，何乐而不为呢？

［演示地址：http://www.doyoe.com/model/dhtml/example/optgroup.htm］

XHTML：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta name="Author" content="飘零雾雨|edzmaster@gmail.com" />
<title>请给select选项分分组吧</title>
</head>
<body>
<div>
<h1>用optgroup给select选项分组：</h1>
<select>
<optgroup label="电脑">
<option>Ibm</option>
<option>Dell</option>
<option>Lenovo</option>
</optgroup>
<optgroup label="手机">
<option>MOTO</option>
<option>NOKIA</option>
<option>SAMAUNG</option>
</optgroup>
</select>
</div>
</body>
</html>
上面是一个给select选项进行分组的例子，当然，这个例子的选项比较少，所以还看不出分组有什么好处或优势。

给select 选项分组主要是用在：

1、有明显的类别区分
2、选项实在太多

需要注意的是：所有的optgroup元素必须在select元素中直接指定，且组不允许嵌套。
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航