移动select中的项到其他select中

系统管理员 2022-06-18 01:36 117阅读 0赞

情形：左边<select></select>的id=select1，右边<select></select>的id=select2，两个select中间有移动按钮，在左边select中点中一项后点击移动按钮移动一项到右边的select中

1.设置两个select的multiple="true"

<tr>  
  <td>  
  <select id="select1" name="select1" style="width:200px;height:350px;" size="20" multiple="true"></select>  
  </td>  
   
  <td> <button class="w100 mg\_t4" οnclick="moveOption('select1','select2');" >添加》</button>  
  <br>  
  <button class="w100 mg\_t8" οnclick="moveAllOption('select1','select2);" > 全部添加》》</button>  
  <br>  
  <button class="w100 mg\_t8"  οnclick="moveOption('select2','select1');" >《移除</button>  
  <br>  
    <button class="w100 mg\_t8" οnclick="moveAllOption('select2','select1');" >《《全部移除</button>  
  </td>  
  <td>  
<select id="select2" name="select2" style="width:200px;height:350px;" size="20" multiple="true"></select>  
</td>  
   <td></td>  
  </tr>

\-----------------------------------------------------------------------

function moveOption(x,y)\{  
     var objx=$("\#"+x).find("option:selected");//选中项  
     var objy=$("\#"+y).children();//另一select的children  
        if(objy.length==0)  
            $("\#"+y).append(objx);  
        var flag = true;  
        for(var j=0;j<objx.length;j++)\{  
            flag = true;  
            for(var i=0;i<objy.length;i++)\{  
                if($(objx\[j\]).val()==$(objy\[i\]).val())\{  
                    flag=false;  
                    break;  
                \}  
            \}  
            if(flag)  
                $("\#"+y).append($(objx\[j\]));  
        \}  
        $("\#"+x).find("option:selected").remove();  
  
 \}

function moveAllOption(x,y)\{  
     var objx=$("\#"+x).children();  
     var objy=$("\#"+y).children();  
        if(objy.length==0)  
            $("\#"+y).append(objx);  
        var flag = true;  
        for(var j=0;j<objx.length;j++)\{  
            flag = true;  
            for(var i=0;i<objy.length;i++)\{  
                if($(objx\[j\]).val()==$(objy\[i\]).val())\{  
                    flag=false;  
                    break;  
                \}  
            \}  
            if(flag)  
                $("\#"+y).append($(objx\[j\]));  
        \}  
        $("\#"+x).find("option:selected").remove();  
  
 \}

发表评论取消回复

表情：

评论列表（有 0 条评论，117人围观）

还没有评论，来说两句吧...

相关阅读

相关 HTML+JS实现左边select移动到右边select

如图所示：左右两个select标签，左边有10个option，要求实现双击左侧选项即可移动到右侧，选择选项后点击“批量右移”可以移动到右侧，点击“全部右移”则全部一次性右移

灰太狼/ 2023年10月18日 09:39/ 0 赞/ 129 阅读

相关 Oracle中select 1和select *的区别

转自：[https://www.linuxidc.com/Linux/2010-05/26202.htm][https_www.linuxidc.com_Linux_2010-

- 日理万妓/ 2023年10月09日 09:52/ 0 赞/ 58 阅读

相关 matlab中selection,Data Selection

Selecting Data to Fit in Curve Fitting App To select data to fit, use the drop-down lis

蔚落/ 2023年01月15日 05:55/ 0 赞/ 147 阅读

相关 MybatisPlus中的select操作

查询操作： 1、根据id查询一条记录 @Test void testSelectById() { // 查询单个用户，只根据一个id查

缺乏、安全感/ 2022年12月30日 10:37/ 0 赞/ 660 阅读

相关 select 中option的使用以及动态增加select

<html> <head> <SCRIPT LANGUAGE="JavaScript"> <!-- //oSelect 列表的底部添加了一个新选项 func

落日映苍穹つ/ 2022年09月17日 12:17/ 0 赞/ 860 阅读

相关 select中option改变时跳转到其他页面

html代码： <div class="friend\_link"> <select οnchange=mbar(this

朱雀/ 2022年08月05日 20:29/ 0 赞/ 313 阅读

相关移动select中的项到其他select中

情形：左边<select></select>的id=select1，右边<select></select>的id=select2，两个select中间有移动按钮，在左边sele

系统管理员/ 2022年06月18日 01:36/ 0 赞/ 118 阅读

相关 python中的查询（select）

sql语句的执行顺序： from where group by select having order by limit 一

喜欢ヅ旅行/ 2022年05月24日 04:43/ 0 赞/ 277 阅读

相关 iview中select的使用

待完善 [参考][Link 1] option绑定值和显示值问题 <FormItem label="区域" prop="DistrictId">

约定不等于承诺〃/ 2022年04月24日 10:06/ 0 赞/ 443 阅读

相关 Oracle中select 1和select *的区别

转： [Oracle中select 1和select \的区别][Oracle_select 1_select] 转自：[https://www.linuxidc.co

「爱情、让人受尽委屈。」/ 2021年10月29日 12:36/ 0 赞/ 371 阅读