点击左侧跳到右侧

谁践踏了优雅 2023-06-11 13:22 11阅读 0赞

效果图

![979265-20170413182207783-431878873.png][]

JS部分

function moveOption(e1, e2){ try{ for(var i=0;i<e1.options.length;i ){ if(e1.options[i].selected){ var e = e1.options[i]; e2.options.add(new Option(e.text, e.value)); e1.remove(i); ii=i-1 } } } catch(e){} }

HTML以及CSS部分

<form method="post" name="myform"> <table border="0" width="500"> <tr> <td width="200px"> <select style="WIDTH:100%" multiple name="list1" size="12" ondblclick="moveOption(document.myform.list1, document.myform.list2)"> <option value="1">身份证号码</option> <option value="2">银行卡号</option> <option value="3">营业执照号码</option> <option value="4">组织机构代码</option> <option value="5">税务登记号码</option> <option value="6">邮政编码</option> <option value="7">姓名/公司名称</option> </select> </td> <td width="100px" align="center"> <input type="button" value="添加" onclick="moveOption(document.myform.list1, document.myform.list2)"><br/> <br/> <input type="button" value="删除" onclick="moveOption(document.myform.list2, document.myform.list1)"> </td> <td width="200px"> <select style="WIDTH:100%" multiple name="list2" size="12" ondblclick="moveOption(document.myform.list2, document.myform.list1)"> </select> </td> </tr> </table></form>

更多专业前端知识，请上 **【猿2048】www.mk2048.com**

[979265-20170413182207783-431878873.png]: /images/20230531/b6f73e9a49194f5daa0bcc7da6e9fe18.png

发表评论取消回复

表情：

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

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

相关阅读

相关左侧导航栏和右侧页面跳转实现（JavaScript）

导航栏在网页设计中起到了重要的作用，它可以帮助用户快速地导航到不同的页面。本文将介绍如何使用JavaScript实现一个左侧导航栏，并实现点击导航项时右侧页面的跳转。首先，

矫情吗；*/ 2024年02月25日 04:59/ 0 赞/ 83 阅读

相关 layui后台布局，点击左侧栏，只有页面右侧（主体）发生改变

1、进入layUi官网——》示例——》后台布局——》获取该布局代码 ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text

ゝ一世哀愁。/ 2023年07月20日 08:22/ 0 赞/ 197 阅读

相关点击左侧跳到右侧

效果图 ![979265-20170413182207783-431878873.png][] JS部分 function moveOption(e1, e2){

谁践踏了优雅/ 2023年06月11日 13:22/ 0 赞/ 12 阅读

相关 jquery 实现点击把数据移动右侧点击再次移回到左侧

2018年第一发希望新的一年和大家一下学习更多知识 JS：//把数据左边挪到了右边，再从右边移动回来 function moveOption(e1, e2)

朴灿烈づ我的快乐病毒、/ 2023年06月11日 13:22/ 0 赞/ 20 阅读

相关 layui左侧菜单右侧显示

首先下载编辑好的首页静态文件看一下静态文件的分布 ![在这里插入图片描述][20191026103912601.png] 菜单页面加入如下html内容静态文件地址进

港控/mmm°/ 2023年06月10日 06:27/ 0 赞/ 341 阅读

相关 CSS - 文字高光滑动效果（左侧到右侧亮光）

效果图如下图所示，可自己修改文字颜色及滑动效果的颜色。 ![在这里插入图片描述][2021050811555539.gif] 实现代码 <b cla

素颜马尾好姑娘i/ 2023年01月19日 07:07/ 0 赞/ 5 阅读

相关微信小程序点击左侧列表显示右侧内容

效果： ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmN

谁践踏了优雅/ 2022年12月13日 12:58/ 0 赞/ 260 阅读

相关 bootstrap页面左侧导航栏右侧网页

我们在浏览网页的时候，左侧导航栏，右侧网页的页面很常见，那么你有好奇过那些炫酷好看的页面是怎么做的吗？下面小编带你了解一下这种页面是怎么做的。

浅浅的花香味﹌/ 2022年06月03日 03:53/ 0 赞/ 265 阅读

相关使用网页嵌套iframe标签，点击左侧导航栏，在右侧动态显示页面的信息

<div class="main">  <div class="main_le

Dear 丶/ 2022年04月17日 06:39/ 0 赞/ 401 阅读

相关 JAVA 点击按钮后跳到另一个界面

// //一个界面跳到一个另一个界面，关闭一个界面，打开一个新的界面 // import java

r囧r小猫/ 2022年02月01日 03:34/ 0 赞/ 489 阅读