html中<select>标签用法解析及如何设置select的默认选中状态

<select>标签定义和用法

select 元素可创建单选或多选菜单。当提交表单时，浏览器会提交选定的项目，或者收集用逗号分隔的多个选项，将其合成一个单独的参数列表，并且在将 <select>表单数据提交给服务器时包括 name 属性。

<select>标签可选的属性

属性 值 描述

disabled disabled 规定禁用该下拉列表。

multiple multiple 规定可选择多个选项。

namename规定下拉列表的名称。

sizenumber 规定下拉列表中可见选项的数目。

<select>标签全局属性

<select>标签支持 HTML 中的全局属性。

<select>标签事件属性

<select>标签支持 HTML 中的事件属性。

1、如果select标签是有id属性的，如

<select

id=xx>...

2、则用下述方法获取当前选项的值：

var

v

=

xx.value

或

var

v

=

document.getElementById("xx").value

//此方法兼容性好

3、如果select标签是有name属性的，如

<form

name=form1>

<select

name=xx>...

则用下述方法获取当前选项的值：

var

v

=

form1.xx.value

或

var

v

=

document.getElementsByName("xx")[0].value

4、如果同一页面含有多个name属性相同的标签，则上述[0]中的数字要改为相应的物理顺序号（从0起算）

5、如果select标签不含有任何可供定位的属性，如

<select>...

则用下述方法获取当前选项的值：

var

v

=

document.getElementsByTagName("select")[0].value

如果同一页面含有多个select标签，则上述[0]中的数字要改为相应的物理顺序号（从0起算）

html中清空select标签中的值方法如下：

准备材料：html+jquery、代码编辑器

1、新建一个html文件，命名为test.html，使用jquery清除select中的所有option。

2、在test.html文件内,使用select和option标签创建一个下拉选择框，代码如下：

3、在test.html文件内,设置select的id为myselect，用于下面通过该id获得select对象。

4、在test.html文件内，使用button标签创建一个按钮，按钮名称为“清除所有option”。

5、在test.html文件内，给button按钮绑定onclick点击事件，当按钮被点击时，执行deloption（）函数。

6、在js标签中，创建deloption()函数，在函数内，通过id获得select对象，使用find()方法获得所有的option对象，使用remove()方法来实现删除所有option。

7、在浏览器打开test.html文件，

8、点击按钮，查看实现的效果。

---