Jquery实现两个select框中元素操作

定义两个select下拉列表框

<select id="select1" multiple="multiple" style="width:100px;">

             <option value="aa">aa</option>

             <option value="bb">bb</option>

             <option value="cc">cc</option>

              <option value="dd">dd</option>

</select>

<select id="select2" multiple="multiple" style="width:100px;">

           

</select>

Jquery代码如下：

<script>

         $(function () {

                 //  一左边移动到右边

                 $("#moveToRight").click(function () {

                             var options = $("#select1 option:selected");    //获取左边选中项

                             var removes = options.remove();                       //删除左边下拉列表中选中的选项

                             removes.appendTo("#select2");                        //添加到select2

                  });

                 //  二左边全部移动到右边

                $("#moveAll").click(function () {

                       var options = $("#select1 option");

                       var removes = options.remove();

                       options.appendTo("#select2");

                });

                //  三右边移动到左边

               $("#moveToLeft").click(function () {

                       var options = $("#select2 option:selected");  

                       var removes = options.remove();

                       removes.appendTo("#select1");

                });

                //四右边全部移动到左边

                $("#removeAll").click(function () {

                          var $option = $("#select2 option");

                          var removes = options.remove();

                          $option.appendTo("#select1");

                 });

     });

    </script>