大家好，关于jquery下拉的问题！！！


<select multiple="multiple" id="userid" style="width:200px; height:260px;">
<option>张三</option>
    <option>李四</option>
</select>
<div>
   <span id="add">选中添加到右边&gt;&gt;</span>
   <span id="add_all">全部添加到右边&gt;&gt;</span>
</div>
<select multiple="multiple" id="userid2" style="width:200px; height:260px;">

</select>
<div>
    <span id="remove">&lt;&lt;选中删除到左边</span>
    <span id="remove_all">&lt;&lt;全部删除到左边</span>
</div>
   
jquery代码如下：$('#add').click(function(){
alert("aaa");
var $options=$('#userid option:selected');
var remove = $options.remove();
$remove.appendTo('#userid2');
})
最重效果 ：
我想 选中添加到右边>> 点击这个后 刚才所选的 就跑到右边去了 在左边 这些选择的也会消除。但是现在貌似我点击 一点反应都没有！！大虾帮忙！！！

解决方案 »

  1.   

    万能的CSDN  给个答案呀！！！
      

  2.   


    $('#add').click(function(){ 
         var $append=$('#userid option:selected');
         $append.appendTo($("#userid2"));
    }); 
      

  3.   


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
    <script type="text/javascript">
    $(document).ready(function(){
      $('#add').click(function(){ 
         var $append=$('#userid option:selected');
         $append.appendTo($("#userid2"));
    }); 
    }); 
    </script>
    <title>无标题文档</title>
    </head>
    <body>
    <select multiple="multiple" id="userid" style="width:200px; height:260px;">
        <option>张三</option>
        <option>李四</option>
    </select>
    <div>
       <span id="add">选中添加到右边&gt;&gt;</span>
       <span id="add_all">全部添加到右边&gt;&gt;</span>
    </div>
    <select multiple="multiple" id="userid2" style="width:200px; height:260px;">
    </select>
    <div>
        <span id="remove">&lt;&lt;选中删除到左边</span>
        <span id="remove_all">&lt;&lt;全部删除到左边</span>
    </div>
    </body>
    </html>前提是选中option
      

  4.   


    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <HTML>
     <HEAD>
      <TITLE> New Document </TITLE>
      <META NAME="Generator" CONTENT="EditPlus">
      <META NAME="Author" CONTENT="">
      <META NAME="Keywords" CONTENT="">
      <META NAME="Description" CONTENT="">
      <script   type= "text/javascript"   src= "jquery-1.2.6.js"> </script> 
      <script   type= "text/javascript">
    $(function(){
    $("#add").click(function(){
    var sel=$("#userid option:selected");
    $("#userid2").append(sel);
    $("#userid").remove(sel);
    });
    })  </script>
      <style type="text/css">  </style>
     </HEAD> <BODY>
      <select multiple="multiple" id="userid" style="width:200px; height:260px;">
        <option>张三</option>
        <option>李四</option>
    </select>
    <div>
       <span id="add">选中添加到右边&gt;&gt;</span>
       <span id="add_all">全部添加到右边&gt;&gt;</span>
    </div>
    <select multiple="multiple" id="userid2" style="width:200px; height:260px;">
        
    </select>
    <div>
        <span id="remove">&lt;&lt;选中删除到左边</span>
        <span id="remove_all">&lt;&lt;全部删除到左边</span>
    </div> </BODY>
    </HTML>