jQuery实现多选下来框(multiple select)

来源：互联网发布：淘宝网络兼职编辑：程序博客网时间：2024/06/08 14:30
js代码：
Js代码  
<script type="text/javascript">  
    $(document).ready(function(){  
        $('#add').click(function(){  
            var $options = $('#select1 option:selected');//获取当前选中的项  
            var $remove = $options.remove();//删除下拉列表中选中的项  
            $remove.appendTo('#select2');//追加给对方  
        });  
          
        $('#remove').click(function(){  
            var $removeOptions = $('#select2 option:selected');  
            $removeOptions.appendTo('#select1');//删除和追加可以用appendTo()直接完成  
        });  
          
        $('#addAll').click(function(){  
            var $options = $('#select1 option');  
            $options.appendTo('#select2');  
        });  
          
        $('#removeAll').click(function(){  
            var $options = $('#select2 option');  
            $options.appendTo('#select1');  
        });  
          
        //双击事件  
        $('#select1').dblclick(function(){  
            //var $options = $('#select1 option:selected');  
            var $options = $('option:selected', this);//注意此处“option”与“:”之间的空格，有空格是不可以的  
            $options.appendTo('#select2');  
        });  
          
        $('#select2').dblclick(function(){  
            $('#select2 option:selected').appendTo('#select1');  
        });  
          
    });  
</script>  