首页 > 代码库 > select扩展
select扩展
<select> 标签
定义和用法
<select> 标签创建下拉列表。
HTML 4.01 与 HTML 5 之间的差异
HTML 5 有一些新的属性，同时不再支持一些 HTML 4.01 的属性。
提示和注释：
风信网(www.ithov.com)提示：请在 form 元素中使用此标签来接受用户的输入。
例子
<select>
<option value="http://www.mamicode.com/volvo">Volvo</option>
<option value="http://www.mamicode.com/saab">Saab</option>
<option value="http://www.mamicode.com/opel">Opel</option>
<option value="http://www.mamicode.com/audi">Audi</option>
</select>
属性
| 属性 | 值 | 描述 | 4 | 5 |
|---|---|---|---|---|
| autofocus | true false | 在页面加载时使这个 select 字段获得焦点。 | 5 | |
| data | url | 供自动插入数据。 | 5 | |
| disabled | true false | 当该属性为 true 时，会禁用该菜单。 | 4 | 5 |
| form | true false | 定义 select 字段所属的一个或多个表单。 | 5 | |
| multiple | true false | 当该属性为 true 时，规定可一次选定多个项目。 | 4 | 5 |
| name | unique_name | 定义下拉列表的唯一标识符。 | 4 | 5 |
| size | number | 定义菜单中可见项目的数目。不支持。 | 4 |
标准属性
class, contenteditable, contextmenu, dir, draggable, id, irrelevant, lang, ref, registrationmark, tabindex, template, title如需完整的描述，请访问 HTML 5 中标准属性。
事件属性
onabort, onbeforeunload, onblur, onchange, onclick, oncontextmenu, ondblclick, ondrag, ondragend, ondragenter, ondragleave, ondragover, ondragstart, ondrop, one rror, onfocus, onkeydown, onkeypress, onkeyup, onl oad, onmessage, onm ousedown, onm ousemove, onm ouseover, onm ouseout, onm ouseup, onm ousewheel, onresize, onscroll, onselect, onsubmit, onunload如需完整的描述，请访问 HTML 5 中事件属性。
TIY 实例
简单的下拉列表
<html>
<body>
<form>
<select name="cars">
<option value="http://www.mamicode.com/volvo">Volvo</option>
<option value="http://www.mamicode.com/saab">Saab</option>
<option value="http://www.mamicode.com/fiat">Fiat</option>
<option value="http://www.mamicode.com/audi">Audi</option>
</select>
</form>
</body>
</html>
本例演示如何在 HTML 页面中创建简单的下拉列表框。下拉列表框是一个可选列表。
另一个下拉列表
<html>
<body>
<form>
<select name="cars">
<option value="http://www.mamicode.com/volvo">Volvo</option>
<option value="http://www.mamicode.com/saab">Saab</option>
<option value="http://www.mamicode.com/fiat" selected="selected">Fiat</option>
<option value="http://www.mamicode.com/audi">Audi</option>
</select>
</form>
</body>
</html>
select扩展