<!doctype html>
<html>
<head>
<!--按下>>将1下拉列表中的选中元素移动到2中,<<则相反-->
<style>
</style>
<script>
function tes1(){
var s1=document.getElementById("male");
var s2=document.getElementById("female");
s2.add(s1.options[s1.selectedIndex],null);//select.add(option,before)该方法用来向下拉列表添加选项
s1.remove(s1.selectedIndex);//selec.remove(index)该方法根据index移除选项
//使用remove()方法移除的option选项出现了一次移除两个选项的情况
}
function tes2(){
var s1=document.getElementById("male");
var s2=document.getElementById("female");
s1.add(s2.options[s2.selectedIndex]);
s2.remove(s2.selectedIndex);
}
</script>
<meta charset="UTF-8">
</head>
<body>
<select id="male">
<option value="test1" id="test1">洗衣服</option>
<option value="test2" id="test2">做饭</option>
<option value="test3" id="test3">拖地</option>
<option value="test4" id="test4">洗碗</option>
</select>
<select id="female">
<option value="test5" id="test5">购物</option>
<option value="test6" id="test6">看电影</option>
<option value="test7" id="test7">购物</option>
</select>
<p><input type="button" value=">>" οnclick="tes1()">     <input type="button" value="<<" οnclick="tes2()"></p>
</body>
</html>
<html>
<head>
<!--按下>>将1下拉列表中的选中元素移动到2中,<<则相反-->
<style>
</style>
<script>
function tes1(){
var s1=document.getElementById("male");
var s2=document.getElementById("female");
s2.add(s1.options[s1.selectedIndex],null);//select.add(option,before)该方法用来向下拉列表添加选项
s1.remove(s1.selectedIndex);//selec.remove(index)该方法根据index移除选项
//使用remove()方法移除的option选项出现了一次移除两个选项的情况
}
function tes2(){
var s1=document.getElementById("male");
var s2=document.getElementById("female");
s1.add(s2.options[s2.selectedIndex]);
s2.remove(s2.selectedIndex);
}
</script>
<meta charset="UTF-8">
</head>
<body>
<select id="male">
<option value="test1" id="test1">洗衣服</option>
<option value="test2" id="test2">做饭</option>
<option value="test3" id="test3">拖地</option>
<option value="test4" id="test4">洗碗</option>
</select>
<select id="female">
<option value="test5" id="test5">购物</option>
<option value="test6" id="test6">看电影</option>
<option value="test7" id="test7">购物</option>
</select>
<p><input type="button" value=">>" οnclick="tes1()">     <input type="button" value="<<" οnclick="tes2()"></p>
</body>
</html>