<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="../js/jquery-1.8.3.js"></script>
<script>
$(function(){
//获得点击事件 单个
$("#selectRight").click(function(){
//2 得到被选中的元素 . 追加 id值为 right
$("#left option:selected").appendTo("#right");
});
// 获得多个 单击事件
$("#selectAllRight").click(function(){
$("#left option").appendTo("#right");
});
});
</script>
</head>
<body>
<table>
<tr>
<td>分类</td>
<td><input type="text" name="cname" value="手机" /></td>
</tr>
<tr>
<td>描述</td>
<td>
<textarea name="cdesc" rows="5" cols="15">
手机数码商品小米9
</textarea>
</td>
</tr>
<tr>
<td>
<span style="float: left;">
<font color="aqua">已经有的商品</font>
<select name="" id="left" multiple="multiple" style="width:100px;height:300px">
<option>iPhone!</option>
<option>小米9</option>
<option>华为10</option>
</select>
<p><a style="padding-left:25px" href="#" id="selectRight">>></a></p>
<p><a style="padding-left:25px" href="#" id="selectAllRight">>>></a></p>
</span>
<span style="float: right;">
<font color="red">未有的商品</font>
<select name="" id="right" multiple="multiple" style="width:100px;height:300px">
<option>opp!</option>
<option>魅族</option>
<option>中兴</option>
</select>
<p><a href="#" ><<</a></p>
<p><a href="#"><<<</a></p>
</span>
</td>
</tr>
</table>
</body>
</html>
