<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript" src="jquery.1.11.1.min.js"></script>
</head>
<body>
<select id="s1" size="2" style="width: 400px;height: 200px;">
<option>1</option>
<option>2</option>
<option>3</option>
</select>
<select id="s2" size="2" style="width: 400px;height: 200px;"></select>
<button id="add">添加</button>
<button id="del">删去</button>
<script type="text/javascript">
$("#add").click(function(){ //将事件绑定在按钮身上
var opt = $("#s1 option:selected").clone(true); // 克隆选中option
opt.appendTo($("#s2")); //把 opt 添加到 s2
});
$("#del").click(function(){ //删除按钮点击的时候，事件在点击时触发
var opt = $("#s2 option:selected");
opt.remove(); // opt 被移除
})
</script>
</body>
</html>
网页效果如下
