将选中的下拉框移动到右边

<div class="content">
    <select multiple id="select1">
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
    </select>
    <div>
        <span id="add">选中的添加到右边</span>
        <span id="add_all">全部添加到右边</span>
    </div>
</div>
<div class="content">
    <select multiple id="select2"></select>
    <div>
        <span id="remove">选中的删除到左边</span>
        <span id="remove_all">全部删除到左边</span>
    </div>
</div>
//将左边的选项添加到右边
$("#add").click(function () {
    var $options = $("#select1 option:selected");  //获取选中的选项
    var $remove = $options.remove();
    $remove.appendTo("#select2");
});
//将左边的全部添加给右边
$("#add_all").click(function () {
    var $options = $("#select1 option");  
    $options.appendTo("#select2");
});
//双击某个选项添加给对方
$("#select1").dbclick(function () {
    var $options = $("option:selected",this); //获取被选中的选项
    $options.appendTo("#select2");
});

 

posted @ 2017-12-18 16:37  念念念不忘  阅读(608)  评论(0)    收藏  举报