JS操作select控件的option

郑景胜
2023-12-01

 

文章转载自:  JS动态操作select的option    http://www.studyofnet.com/news/4.html

 

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("新文本","新值");
 类似资料: