加入收藏 | 设为首页 | 会员中心 | 我要投稿 聊城站长网 (https://www.0635zz.com/)- 智能语音交互、行业智能、AI应用、云计算、5G!
当前位置: 首页 > 教程 > 正文

jquery 操作两个select实现值之间的互相传输

发布时间:2023-10-23 14:49:50 所属栏目:教程 来源:
导读:代码如下:

function moveToRight(select1,select2)//把选中的移动到右边 sleect1和sleect2分别是下拉列表框的ID

{

$('#'+select1+' option:selected').each(function(){

$("<opt
代码如下:
 
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');
 
    });
 
 

(编辑:聊城站长网)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章