就是实现这个效果的，选中添加到右边，全部添加到右边，选中删除到左边，全部删除到左边。
html部分：
<body>
<div class=”centent”>
<select multiple=”multiple” id=”select1″ style=”width:100px;height:160px;”>
<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>
<option value=”6″>选项6</option>
<option value=”7″>选项7</option>
</select>
<div>
<span id=”add” >选中添加到右边>></span>
<span id=”add_all” >全部添加到右边>></span>
</div>
</div>
<div class=”centent”>
<select multiple=”multiple” id=”select2″ style=”width: 100px;height:160px;”>
<option value=”8″>选项8</option>
</select>
<div>
<span id=”remove”><<选中删除到左边</span>
<span id=”remove_all”><<全部删除到左边</span>
</div>
</div>
</body>
这里要注意的是select的multiple属性，只有添加了之后，才会在select框中出现多个select选项。
否则只会显示出一条。
jQuery代码解析：
