JavaScript添加和删除select下拉项

2018-3-8 14:37| 作者: admin| 查看: 499| 评论: 0|来自: 蚂蚁部落

select下拉菜单在网页中非常的常用,有时需要根据特定情况,对select下拉菜单进行动态的操作。

下面就简单介绍一下相关内容,希望能够给大家带来一定的帮助。

一.动态创建一个select下拉菜单:

[JavaScript] 纯文本查看 复制代码
var theSelect=document.createElement("select"); 
theSelect.id="newId"; 
document.body.appendChild(theSelect);

以上代码创建了一个select下拉菜单对象,并且设置id属性值。

二.为下拉菜单添加option选项:

[JavaScript] 纯文本查看 复制代码
//theSelect.add(new Option("文本","值")); //在IE中有效 
theSelect.options.add(new Option("text","value")); //兼容所有主流浏览器

以上代码可以为select下拉菜单添加下拉选项,要注意浏览器兼容性问题。

三.删除一个option项:

[JavaScript] 纯文本查看 复制代码
var index=theSelect.selectedIndex; 
theSelect.options.remove(index);

以上代码可以删除当前被选项。remove()的参数可以是任意选项的索引,索引值从0开始的。

四.删除所有选项:

[JavaScript] 纯文本查看 复制代码
theSelect.options.length=0;

将选项的的长度设置为0即可。



鲜花

握手

雷人

路过

鸡蛋

最新评论

返回顶部