SELECT控件操作的JS代码示例
1 检测是否有选中
if(objSelect.selectedIndex > -1) {
//说明选中
} else {
//说明没有选中
}
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('mySelect');
//添加一个选项
obj.add(new Option("文本","值"));
}
4.删除所有选项option
function removeAll(){
var obj=document.getElementByIdx('mySelect');
obj.options.length=0;
}
5.删除一个选项option
function removeOne(){
var obj=document.getElementByIdx('mySelect');
//index,要删除选项的序号,这里取当前选中选项的序号
var index=obj.selectedIndex;
obj.options.remove(index);
}
6.获得选项option的值
var obj=document.getElementByIdx('mySelect');
var index=obj.selectedIndex; //序号,取当前选中选项的序号
var val = obj.options[index].value;
7.获得选项option的文本
var obj=document.getElementByIdx('mySelect');
var index=obj.selectedIndex; //序号,取当前选中选项的序号
var val = obj.options[index].text;
8.修改选项option
var obj=document.getElementByIdx('mySelect');
var index=obj.selectedIndex; //序号,取当前选中选项的序号
var val = obj.options[index]=new Option("新文本","新值");
9.删除select
function removeSelect(){
var mySelect = document.getElementByIdx("mySelect");
mySelect.parentNode.removeChild(mySelect);
}
一、基础理解:
var e = document.getElementByIdx("selectId");
e.options = new Option("文本", "值"); //创建一个option对象
,即在标签中创建一个或多个。options是一个数组,里面可存放多个标签。
1、options数组的属性: length -------长度属性 selectedIndex ------ 当前被选中的文本的索引值,此索引值是内存自动分配的(0,1,2,3....)对应(第一个文本值,第二个文本值,第三个文本值,第四个文本值.......)
2、单个option的属性(即obj.options[obj.selectedIndex]是指定的某个
全选" onclick="choiceAll('left')"> 未选择
全选" onclick="choiceAll('right')">
<SELECTmultiple="multiple"[J1] style="width:200px" size="20" id="left" > 添加" onclick="move('left','right')" style="background: #deb887;">
删除>>" onclick="move('right','left')" style="background:#ffebcd;"> <SELECTmultiple="multiple" style="width:200px" size="20" id="right" >