日期:2014-05-16  浏览次数:20425 次

javascript select option对象总结

javascript select option对象总结
一、基础理解:
var e = document.getElementByIdx_x("selectId");
e.options = new Option("文本", "值"); //创建一个option对象,即在<select>标签中创建一个或多个<option value="值">文本</option>。
options是一个数组,里面可存放多个<option value="值">文本</option>标签。
?
1、options 数组的属性:
length ===== 长度属性
selectedIndex?===== 当前被选中的文本的索引值,此索引值是内存自动分配的(0,1,2,3....)对应(第一个文本值,第二个文本值,第三个文本值,第四个文本值.......)
?
2、单个option的属性(即obj.options[obj.selectedIndex]是指定的某个<option>标签):
text =====?返回/指定文本
value ===== 返回/指定文本,与<option value="...">一致
index ====== 返回下标
selected ====== 返回/指定该对象是否被选中,指定true or false可动态改变选中项
defaultSelected ===== 返回该对象默认是否被选中,true or false
?
3、option的方法:
增加一个<option>标签 ====== obj.options.add(new("文本", "值"))
删除一个<option>标签 ====== obj.options.remove(obj.selectedIndex);
获取一个<option>标签 ====== obj.options[obj.selectedIndex].text ;
修改一个<option>标签 ====== obj.options[obj.selectedIndex] = new Option("新文本", "值") ;
删除所有<option>标签 ====== obj.options.length = 0 ;
获取一个<option>标签的值 ===== obj.options[obj.selectedIndex].value ;
?
注意:
????obj.option中的option不需要大写
????new Option中的option需要大写
?
实例:

1 检测是否有选中
if(objSelect.selectedIndex > -1) {
??alert("选中");//说明选中
} else {
??alert("没有选中");//说明没有选中
}

2.动态创建select

function createSelect(){

??var mySelect = document.createElement_x("select");
??mySelect.id = "mySelect";
??document.body.appendChild(mySelect);
}

3.添加选项option

function addOption(){

??//根据id查找对象,
??var obj=document.getElementByIdx_x('mySelect');

??//添加一个选项?
??//obj.add(new Option("文本","值"));????//只能在IE中有效???
??obj.options.add(new Option("文本","值")); //兼容IE与firefo?
}

4.删除所有选项option

function removeAll(){
?