左右移动下拉框中的内容,代码如下:
<!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" /> <title>基本选择器学习--左右移动下拉框中内容-www.jb200.com</title> <script language="javascript" type="text/javascript" src="/jquery/jquery-1.7.1.min.js"></script> </head> <style> </style> <script language="javascript" type="text/javascript" > //使用jquery加载事件 //$("select option:selected") :匹配所有选中的option元素 //把所有匹配的元素追加到另一个指定的元素元素集合中。 $(document).ready(function(){ $("#lmove").click(function(){ $(".left option:selected").appendTo(".right "); }); $("#rmove").click(function(){ $(".right option:selected").appendTo(".left "); }); }); </script> <body> <select class="left" size="10"> <option >脚本学堂--过去吧。</option> <option>脚本学堂--过去吧。</option> <option>脚本学堂--过去吧。</option> <option>脚本学堂--过去吧。</option> </select> <input type="button" id="lmove" value=">>" /> <input type="button" id="rmove" value="<<" /> <select class="right" size="10"> <option>脚本学堂--过来吧。</option> <option>脚本学堂--过来吧。</option> <option>脚本学堂--过来吧。</option> <option>脚本学堂--过来吧。</option> </select> </body> </html>