jQuery实现select多选框左右添加，包括双击事件

<table width="285" height="169" border="0" align="left" cellpadding="0" cellspacing="0" style="margin:15px 0px 0px 15px;">

  <tr>

    <td width="126">

    <!--multiple="multiple" 能同时选择多个   size="10"  确定下拉选的长度-->
<select name="first" size="10" multiple="multiple" class="td3" id="first">
 <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>
 <option value="选项8">选项8</option>
</select>    
</td>

    <td width="69" valign="middle">

       <input name="add"  id="add" type="button" class="button" value="-->" /> 

       <input name="add_all" id="add_all"  type="button" class="button" value="==>" /> 

       <input name="remove"  id="remove" type="button" class="button" value="<--" />
  <input name="remove_all"  id="remove_all" type="button" class="button" value="<==" />

        </td>

    <td width="127" align="left">
 <select name="second" size="10" multiple="multiple" class="td3" id="second">

         <option value="选项9">选项9</option>

      </select>
</td>

  </tr>
</table>

<script type="text/javascript">

 

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

  $("#first option").each(function(){

  if(this.selected==true){

  $("#second").append(this);

  }

  });

  });

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

  $("#first option").each(function(){

  $("#second").append(this);

  });

  });

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

  $("#second option").each(function(){

  if(this.selected==true){

  $("#first").append(this);

  }

  });

  });

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

  $("#second option").each(function(){

  $("#first").append(this);

  });

  });

 

  $("#first").dblclick(function(){

  $("#first option").each(function(){

  if(this.selected==true){

  $("#second").append(this);

  }

  });

  });

</script>