Welcome 微信登录
编程资源 图片资源库 蚂蚁家优选 PDF转换器 软件资源

软件开发小程序制作系统集成与运维空间租用硬件开发视频监控技术咨询与支持——联系电话:0311-88999002/88999003

首页 / 脚本样式 / JavaScript / jquery 操作两个select实现值之间的互相传递

复制代码 代码如下:
function moveToRight(select1,select2)//把选中的移动到右边 sleect1和sleect2分别是下拉列表框的ID
{
 $("#"+select1+" option:selected").each(function(){
  $("<option value=""+$(this).val()+"">"+$(this).text()+"</option>").appendTo("#"+select2+"");
  $(this).remove();
  $("#"+select2).bind("dblclick",function(){
  moveToLeft(select1,select2);
  });  
 });
}
function moveAllToRight(select1,select2)//把所有的移动到右边
{
 $("#"+select1+" option").each(function(){
  $("<option value=""+$(this).val()+"">"+$(this).text()+"</option>").appendTo("#"+select2+"");
  $(this).remove();
 });
}
function moveToLeft(select1,select2)//把选中的移动到左边
{
 $("#"+select2+" option:selected").each(function(){
  $("<option value=""+$(this).val()+"">"+$(this).text()+"</option>").appendTo("#"+select1+"");
  $(this).remove();
 });
}
function moveAllToLeft(select1,select2)//把所有的移动到左边
{
 $("#"+select2+" option").each(function(){
  $("<option value=""+$(this).val()+"">"+$(this).text()+"</option>").appendTo("#"+select1+"");
  $(this).remove();
 });
}

如果要双击select中的某一个option就把当前值传到另一个select需要bind一个select 事件 如下即可
复制代码 代码如下:
$("#sel2").bind("dblclick",function(){//给下拉框绑定双击事件
     moveToRight("sel2","sel3");
    });
    $("#sel3").bind("dblclick",function(){
     moveToLeft("sel2","sel3");
    });