<html>
<head>
<title>js操作select实例</title>
</head>
<script>
/*主要介绍js动态操作select各种方法,也可以实现左右分栏的功能*/
/
function removeItem(sel_source)
{
var selobj=document.getElementById("yixuan");
var i=0;
var length = selobj.options.length;
while(i<length)
{
var op = selobj.options[i];
var index =op.index;
alert(op.innerHTML)
if(op.selected)
{
//document.getElementById("yixuan").options.remove(index);
//op.remove();
i--;
}
i++;
length = selobj.options.length;
}
}
/*添加option属性*/
function add()
{
var selobj=document.getElementById("yixuan");
var varItem = new Option("123","yierdan"); /*显示值、真实值*/
selobj.options.add(varItem);
}
/*清空select中的数据*/
function qingkong()
{
var selobj=document.getElementById("yixuan");
selobj.options.length=0;
}
</script>
</head>
<body>
<input type="button" value="添加" οnclick="add()">
<input type="button" value="移除" οnclick="removeItem(yixuan)">
<input type="button" value="清空" οnclick="qingkong(yixuan)">
<select name="yixuan" id="yixuan" multiple style="width:300;height:600">
<option value="1">数据1</option>
<option value="2">数据2</option>
<option value="3">数据3</option>
<option value="4">数据4</option>
<option value="5">数据5</option>
</select>
</body>
</html>
<head>
<title>js操作select实例</title>
</head>
<script>
/*主要介绍js动态操作select各种方法,也可以实现左右分栏的功能*/
/
function removeItem(sel_source)
{
var selobj=document.getElementById("yixuan");
var i=0;
var length = selobj.options.length;
while(i<length)
{
var op = selobj.options[i];
var index =op.index;
alert(op.innerHTML)
if(op.selected)
{
//document.getElementById("yixuan").options.remove(index);
//op.remove();
i--;
}
i++;
length = selobj.options.length;
}
}
/*添加option属性*/
function add()
{
var selobj=document.getElementById("yixuan");
var varItem = new Option("123","yierdan"); /*显示值、真实值*/
selobj.options.add(varItem);
}
/*清空select中的数据*/
function qingkong()
{
var selobj=document.getElementById("yixuan");
selobj.options.length=0;
}
</script>
</head>
<body>
<input type="button" value="添加" οnclick="add()">
<input type="button" value="移除" οnclick="removeItem(yixuan)">
<input type="button" value="清空" οnclick="qingkong(yixuan)">
<select name="yixuan" id="yixuan" multiple style="width:300;height:600">
<option value="1">数据1</option>
<option value="2">数据2</option>
<option value="3">数据3</option>
<option value="4">数据4</option>
<option value="5">数据5</option>
</select>
</body>
</html>