jquary 双select用法
项目要用到双select，这个完成：单个的在select之间左右异动，和全部的异动。最后以字符串的形式将需要的值提交：<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html><head><title>select 使用</title><META http-equiv=Content-Type content="text/html; charset=UTF-8"> <!-- 这里放css --> <script type="text/javascript" src="js/jquery-1.3.2.min.js"></script> <script type="text/javascript"> <!--移动人员-->//从左到右function left_to_right(){var selectText=$("#emp_left").find("option:selected").text();var selectValue=$("#emp_left").val();//检验左边select是否有选中if (null==selectValue||selectValue=="") {alert("请先选择左边的员工！"); return; }else{ var selectop = "<option value='"+selectValue+"'>"+selectText+"</option>"; // 填充右侧的值 $("#emp_right").append(selectop); $("#emp_left option:selected").remove(); }};////从右到左function right_to_left(){var selectText=$("#emp_right").find("option:selected").text();var selectValue=$("#emp_right").val();//检验左边select是否有选中if (null==selectValue||selectValue=="") {alert("请先选择右边的员工！"); return; }else{ var selectop = "<option value='"+selectValue+"'>"+selectText+"</option>"; // 填充右侧的值 $("#emp_left").append(selectop); $("#emp_right option:selected").remove(); }};//全部从左到右function all_left_to_right(){var $options = $('#emp_left option'); $options.appendTo('#emp_right'); $('#emp_left option').remove(); }//全部从右到左function all_right_to_left(){var $options = $('#emp_right option'); $options.appendTo('#emp_left'); $('#emp_right option').remove(); }//提交,即将右边选框的所有员工提交function submitMyForm(){var subtext="";$('#emp_right option').each(function() {subtext += $(this).val()+','; }); alert(subtext); }</script></head><body><table><tr><td align="right"><select name="emp_left" id="emp_left" class="select_emp" size="30"><option value="1" selected="selected"> 111111111111</option> <option value="2" selected="selected"> 22222222222</option> <option value="3" selected="selected"> 3333333333333</option> <option value="4" selected="selected"> 44444444444444</option> <option value="5" selected="selected"> 5555555555555555</option> <option value="6" selected="selected"> 66666666666666666666</option> <option value="7" selected="selected"> 77777777777777777777777</option></select></td><td></td><td valign="middle" align="center" class="btn_move"><table><tr><td><img src="images/toright.jpg" style="cursor: pointer;" /></td></tr><tr><td><img src="images/toleft.jpg" style="cursor: pointer;" /></td></tr><tr><td><img src="images/alltoright.jpg" style="cursor: pointer;" /></td></tr><tr><td><img src="images/alltoleft.jpg" style="cursor: pointer;" /></td></tr><tr><td><img src="images/button_cancel.gif" style="cursor: pointer;" /></td></tr><tr><td><img src="images/ok.gif" style="cursor: pointer;" /></td></tr></table></td><td></td><td><select name="emp_right" id="emp_right" class="select_emp" size="30"><option value="8" selected="selected"> 8888888888888888 </option></select></td></tr></table></body>
页:
[1]