首页 / 脚本样式 / JavaScript / JS对select控件option选项的增删改查示例代码

Javascript 操作select是表单中常见的一种,下面介绍几种常用的JS动态操作select中的各种方法：
复制代码 代码如下:
//动态创建select
function createSelect（）
{
var mySelect = document.createElement（"select"）;
mySelect.id = "mySelect";
document.body.appendChild（mySelect）;
}

复制代码 代码如下:
//添加选项option
function addOption（）
{
//根据id查找对象，
var obj=document.getElementById（"mySelect"）;
//添加一个选项
obj.add（new Option（"文本","值"））; //这个只能在IE中有效
obj.options.add（new Option（"text","value"））; //这个兼容IE与firefox
}

复制代码 代码如下:
//删除所有选项option
function removeAll（）
{
var obj=document.getElementById（"mySelect"）;
obj.options.length=0;
}

复制代码 代码如下:
//删除一个选项option
function removeOne（）
{
var obj=document.getElementById（"mySelect"）;
//index,要删除选项的序号，这里取当前选中选项的序号
var index=obj.selectedIndex;
obj.options.remove（index）;
}

复制代码 代码如下:
//获得选项option的文本
var obj=document.getElementById（"mySelect"）;
var index=obj.selectedIndex; //序号，取当前选中选项的序号
var val = obj.options[index].text;

复制代码 代码如下:
//修改选项option
var obj=document.getElementById（"mySelect"）;
var index=obj.selectedIndex; //序号，取当前选中选项的序号
var val = obj.options[index]=new Option（"新文本","新值"）;