管理资源吧首页>>>教程>>>编程>>>JavaScript教程>>>

JS操作select下拉框动态变动(创建/删除/获取)

　　1.动态创建select

　　

复制代码 代码如下:

　　function createSelect(){

　　var mySelect = document.createElement_x("select");

　　mySelect.id = "mySelect";

　　document.body.appendChild(mySelect);

　　}

　　2.添加选项option

　　

复制代码 代码如下:

　　function addOption(){

　　//根据id查找对象，

　　var obj=document.getElementByIdx_x('mySelect');

　　//添加一个选项

　　obj.add(new Option("文本","值"));

　　}

　　3.删除所有选项option

　　

复制代码 代码如下:

　　function removeAll(){

　　var obj=document.getElementByIdx_x('mySelect');

　　obj.options.length=0;

　　}

　　4.删除一个选项option

　　

复制代码 代码如下:

　　function removeOne(){

　　var obj=document.getElementByIdx_x('mySelect');

　　//index,要删除选项的序号，这里取当前选中选项的序号

　　var index=obj.selectedIndex;

　　obj.options.remove(index);

　　}

　　5.获得选项option的值

　　

复制代码 代码如下:

　　var obj=document.getElementByIdx_x('mySelect');

　　var index=obj.selectedIndex; //序号，取当前选中选项的序号

　　var val = obj.options[index].value;

　　6.获得选项option的文本

　　

复制代码 代码如下:

　　var obj=document.getElementByIdx_x('mySelect');

　　var index=obj.selectedIndex; //序号，取当前选中选项的序号

　　var val = obj.options[index].text;

　　7.修改选项option

　　

复制代码 代码如下:

　　var obj=document.getElementByIdx_x('mySelect');

　　var index=obj.selectedIndex; //序号，取当前选中选项的序号

　　var val = obj.options[index]=new Option("新文本","新值");

　　8.删除select

　　

复制代码 代码如下:

　　function removeSelect(){

　　var mySelect = document.getElementByIdx_x("mySelect");

　　mySelect.parentNode.removeChild(mySelect);

　　}

教程首页 更多教程