HTML <select> 标签 创建单选或多选菜单
所有主流浏览器都支持 <select> 标签。
select 元素可创建单选或多选菜单。
<select&> 元素中的 <option> 标签用于定义列表中的可用选项。
提示：select 元素是一种表单控件，可用于在表单中接受用户输入。
属性
New: HTML5 中的新属性。
| 属性 | 值 | 描述 |
|---|---|---|
| autofocus（5） | autofocus | 规定在页面加载后文本区域自动获得焦点。 |
| disabled | disabled | 规定禁用该下拉列表。 |
| form（5） | form_id | 规定文本区域所属的一个或多个表单。 |
| multiple | multiple | 规定可选择多个选项。 |
| name | name | 规定下拉列表的名称。 |
| required（5） | required | 规定文本区域是必填的。 |
| size | number | 规定下拉列表中可见选项的数目。 |
<html> <body> <form>
<select name="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="fiat">Fiat</option>
<option value="audi">Audi</option>
</select>
</form> </body>
</html>
- 本例演示如何创建一个简单的带有预选值的下拉列表。（译者注：预选值指预先指定的首选项。）
<html> <body> <form>
<select name="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="fiat" selected="selected">Fiat</option>
<option value="audi">Audi</option>
</select>
</form> </body>
</html>
附：Select 对象
Select 对象代表 HTML 表单中的一个下拉列表。
在 HTML 表单中，<select> 标签每出现一次，一个 Select 对象就会被创建。
您可通过遍历表单的 elements[] 数组来访问某个 Select 对象，或者使用 document.getElementById()。
Select 对象集合
| 集合 | 描述 |
|---|---|
| options[] | 返回包含下拉列表中的所有选项的一个数组。 |
Select 对象属性
| 属性 | 描述 |
|---|---|
| disabled | 设置或返回是否应禁用下拉列表。 |
| form | 返回对包含下拉列表的表单的引用。 |
| id | 设置或返回下拉列表的 id。 |
| length | 返回下拉列表中的选项数目。 |
| multiple | 设置或返回是否选择多个项目。 |
| name | 设置或返回下拉列表的名称。 |
| selectedIndex | 设置或返回下拉列表中被选项目的索引号。 |
| size | 设置或返回下拉列表中的可见行数。 |
| tabIndex | 设置或返回下拉列表的 tab 键控制次序。 |
| type | 返回下拉列表的表单类型。 |
Select 对象事件句柄
| 事件句柄 | 描述 |
|---|---|
| onchange | 当改变选择时调用的事件句柄。 |
HTML <select> 标签 创建单选或多选菜单的更多相关文章
- HTML&CSS基础学习笔记1.24-input标签的单选与多选
单选和多选 单选框和多选框是用<input>标签来实现的. <input>标签的type属性值为"checkbox"时,表示多选框,为"radio ...
- select标签
select标签 select 可以创建单选或多选菜单. <!DOCTYPE html> <html> <head> <meta charset=" ...
- HTML中select标签单选多选详解
select 元素可创建单选或多选菜单.当提交表单时,浏览器会提交选定的项目,或者收集用逗号分隔的多个选项,将其合成一个单独的参数列表,并且在将 <select> 表单数据提交给服务器时包 ...
- HTML <select> 标签
定义和用法 select 元素可创建单选或多选菜单. <select&> 元素中的 <option> 标签用于定义列表中的可用选项. HTML 4.01 与 HTML ...
- php一些单选、复选框的默认选择方法（示例）
转载 http://www.php.cn/php-weizijiaocheng-360029.html 一. radio和checkbox及php select默认选择的实现代码 1.radio单选框 ...
- Shell：如何写一个多选菜单的脚本
Blog:博客园 个人 翻译自How to Create a Multiple Choice Menu in Bash Scripts 目录 多选菜单脚本介绍 配置输入提示 创建预定选项列表 创建预选 ...
- 多选菜单shell脚本
有 很多方法 可以读取Bash脚本中的用户输入. 但是,允许用户键入输入会带来一些问题. 主要问题是输入验证,您必须在其中考虑所有可能的输入. 解决此问题的一种简单方法是为Bash脚本创建一个多选菜单 ...
- Django之model.form创建select标签
前言 之前我们学习了form表单验证用户输入格式和自动创建HTML,那么如果用户创建select标签时怎么办呢,先来看下这个东西: models.py 数据格式: class UserInfo(mod ...
- 使用 SVG 制作单选和多选框动画【附源码】
通过 JavaScript 实现 SVG 路径动画,我们可以做很多花哨的东西.今天我们要为您介绍一些复选框和单选按钮效果.实现的主要思路是隐藏原生的输入框,使用伪元素创造更具吸引力的样式,输入框被选中 ...
随机推荐
- Jeet – 先进，直观，灵活的 CSS 网格系统
Jeet 是一个先进的,直观的 CSS 网格系统.通过使用预处理器的强大功能,我们现在可以通过实际分数(或者浮点数)来生成一个基于百分比宽度和间隔的网格.让你用更少的代码,更快的速度构建页面布局. 您 ...
- 解决AndroidADT自带Eclipse编辑器不能自动代码提示的问题。
今天发现,我下载的AndroidADT开发套装中自带的Eclipse没有自动代码提示功能.通过参考http://blog.csdn.net/coolszy/article/details/724195 ...
- matlab 读取excel
clear;clc; tic;%启动计时器,计算程序运行时间 a=xlsread('C:\Documents and Settings\Administrator\桌面\data.xls');b=a( ...
- SQL Server代理(8/12)：使用SQL Server代理外部程序
SQL Server代理是所有实时数据库的核心.代理有很多不明显的用法,因此系统的知识,对于开发人员还是DBA都是有用的.这系列文章会通俗介绍它的很多用法. 在这个系列的上篇文章里,你学习如何使用SQ ...
- 自绘制HT For Web ComboBox下拉框组件
传统的HTML5的下拉框select只能实现简单的文字下拉列表,而HTforWeb通用组件中ComboBox不仅能够实现传统HTML5下拉框效果,而且可以在文本框和下拉列表中添加自定义的小图标,让整个 ...
- Asp.net(C#) windows 服务{用于实现计划任务,事件监控等}
什么是windows服务? 一个Windows服务程序是在Windows操作系统下能完成特定功能的可执行的应用程序.Windows服务程序虽然是可执行的,但是它不像一般的可执行文件通过双击就 ...
- MVC EF中Attach和Entry区别
EF:加入容器三种方式-->查询,attach,entry.不在容器里,不能用remove,add等方法. 1.0 使用Attach可能会出错.//attach 意思:附上; 贴上,系;var ...
- 【Remoting】.Net remoting方法实现简单的在线升级（上篇：更新文件）
一.前言: 最近做一个简单的在线升级Demo,使用了微软较早的.Net Remoting技术来练手. 简单的思路就是在服务器配置一个Remoting对象,然后在客户端来执行Remoting ...
- QTableWidget 使用及美化_QtableWidget_QtableView滚动条宽度及样式
//创建及属性设置m_tableWidget = new QTableWidget(this);m_tableWidget->setRowCount(10);m_tableWidget-&g ...
- 孙鑫MFC学习笔记14:网络编程
1.OSI 2.TCP/IP与OSI对应关系 3.Socket 4.客户机/服务器模式 5.Windows Sockets 6.套接字类型 7.面向连接的socket编程 8.面向无连接的socket ...