標籤：
1 <html> 2 <head> 3 <meta charset="utf-8"> 4 <title>完成左移右移</title> 5 <script src="jquery.js"></script> 6 <style type="text/css"> 7 table{background-color:purple;} 8 input{background-color:blue;} 9 </style>10 <script language="javascript">11 $("document").ready(function(){12 $("#b1").click(function(){13 var v1=$("#k1").find("option:selected").text();14 if(v1!=null){15 $("#k2").append("<option value=‘‘>"+v1+"</option>");16 $("#k1 option:selected").remove()17 } 18 }); 19 20 $("#b2").click(function(){21 var v2=$("#k2").find("option:selected").text();22 if(v2!=null){23 $("#k1").append("<option value=‘‘>"+v2+"</option>");24 $("#k2 option:selected").remove();25 }26 });27 });28 </script> 29 </head>30 <body>31 <form action="#" method="post">32 <table>33 <tr>34 <td>35 <select id="k1" size="10" style="width:200px;">36 <option id="p1">檸檬學院</option>37 <option id="p2">檸檬學員</option>38 <option id="p3">檸檬人</option>39 </select>40 </td>41 <td>42 <input type="button" id="b1" value=">>"/>43 <input type="button" id="b2" value="<<"/> 44 </td>45 <td>46 <select id="k2" size="10" style="width:200px;">47 <option>李哥</option> 48 </select>49 </td>50 </tr>51 </table>52 </form> 53 </body>54 </html>
jQuery實現左移右移
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
