子项可以来回交换的两个下拉列表
Posted 参谋长
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了子项可以来回交换的两个下拉列表相关的知识,希望对你有一定的参考价值。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<select id="leftBox" multiple="multiple" style="height: 200px; width: 100px;">
<option value="1">a</option>
<option value="2">b</option>
<option value="3">c</option>
<option value="4">d</option>
</select>
<input type="button" value=">" onclick="move(‘leftBox‘,‘rightBox‘)"/>
<input type="button" value="<" onclick="move(‘rightBox‘,‘leftBox‘)"/>
<select id="rightBox" multiple="multiple" style="height: 200px; width: 100px;">
<option value="11">A</option>
<option value="22">B</option>
<option value="33">C</option>
<option value="44">D</option>
</select>
</body>
</html>
<script type="text/javascript">
function move(from,to) {
var fromBox = document.getElementById(from);
var toBox = document.getElementById(to);
while(fromBox.selectedIndex != -1){
toBox.appendChild(fromBox.options[fromBox.selectedIndex]);
}
}
</script>
以上是关于子项可以来回交换的两个下拉列表的主要内容,如果未能解决你的问题,请参考以下文章