<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>水果选择</title>

</head>

<style type="text/css">

       select{

           width: 200px;

           height: 100px;

       }

</style>

<body>

      <h1>水果选择：</h1>

       <select name="" id="left"  size="">

                 <option>苹果</option>

                 <option>橘子</option>

                 <option>香蕉</option>

                 <option>西瓜</option>

                 <option>草莓</option>

       </select>

       <input type="button"  value=">>" name="" id="btn">

      <select name="" id="right" size=""></select>

</body>

<script type="text/javascript">

        btn=document.getElementById('btn');

        left=document.getElementById('left');

        right=document.getElementById('right');

        opts=left.options;

        btn.onclick=function(){

              idx=left.selectedIndex;

              right.add(opts[idx]);

        }

</script>

</html>

JS左右栏目添加器的更多相关文章

  1. (vue.js)axios interceptors 拦截器中添加headers 属性

    (vue.js)axios interceptors 拦截器中添加headers 属性:http://www.codes51.com/itwd/4282111.html 问题: (vue.js)axi ...

  2. PHPCMS v9栏目添加字段及描述编辑器修改方法

    为PHPCMS v9栏目添加字段和把描述的textarea编辑器变成fceditor编辑器的方法.如下: 1. 添加数据库字段:description1,添加位置:v9_catetory表 2. 在c ...

  3. JS实现音乐播放器

    JS实现音乐播放器  前  言            最近在复习JS,觉得音乐播放器是个挺有意思的东西,今天就来用我们最原生的JS写一个小小的音乐播放器~ 主要功能: 1.支持循环.随机播放 2.在播 ...

  4. 使用yarn代替npm作为node.js的模块管理器

    使用yarn代替npm作为node.js的模块管理器 转 https://www.jianshu.com/p/bfe96f89da0e     Fast, reliable, and secure d ...

  5. 织梦DedeCMS给栏目添加缩略图调用的方法

    织梦DedeCMS的栏目调用仅仅只有文字调用,没有栏目缩略图调用,而我们有时候又需要给栏目添加缩略图,并能够在前台调用,就可以试试通过下面的方法,给栏目添加缩略图. 首先要给栏目数据库表添加一个存储缩 ...

  6. JS & JQuery 动态添加 select option

    因为是转载文章 在此标明出处,以前有文章是转的没标明的请谅解,因为有些已经无法找到出处,或者与其它原因. 如有冒犯请联系本人,或删除,或标明出处. 因为好的文章,以前只想收藏,但连接有时候会失效,所以 ...

  7. js模块化/js模块加载器/js模块打包器

    之前对这几个概念一直记得很模糊,也无法用自己的语言表达出来,今天看了大神的文章,尝试根据自己的理解总结一下,算是一篇读后感. 大神的文章:http://www.css88.com/archives/7 ...

  8. js改变或添加className

    js改变或添加className <style type="text/css"> .newDiv { font-weight: bold; } </style&g ...

  9. dedecms为导航栏目添加英文标题

    最近公司官网是使用 DedeCMS 做的,这个项目中要使用到为导航栏目添加英文标题,就查找资料把它实现了. 根据设计图写成静态页面后是这样的效果: 操作步骤如下: 1. 修改数据表,添加英文字段 影响 ...

随机推荐

  1. Windows去除快捷箭头

    美化桌面 bat代码: reg add "HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\Windows\CurrentVersion\Explorer\Shel ...

  2. Unix philosophy

    拿来跟python之禅对比一下 每个程序只做一件事,但做到极致 用程序之间的相互协作来解决复杂问题 每个程序都采用文本作为输入和输出,这会使程序更易于使用 参阅:维基百科 The Zen of Pyt ...

  3. php 实现创建文件并追加数据

    最近因为后台有其他事情忙,所以我最近又开始学习php的内容了. (不过话说回来从客户端写到后台的感觉还是很爽的,嘿嘿) 需求是这样:从前台发来一些信息,存成文本文档,以后再统一处理(比如,存入用户账户 ...

  4. inheritableStatics 与statics类

    /** * statics 可以包含类的静态和静态方法,但是不能被子类继承 * inheritableStatics 与statics类似但是可以被子类继承 */ Ext.onReady(functi ...

  5. 开发错误记录9：Application无法跳转到Activity

    今天在做友盟消息推送,当客户端收到推送消息时,如客户端不是活动的,用如下代码 启动Activity发现无法启动,原因是原有的任务栈已消毁,判断启动是如消毁,如有,再新建一个 只要给它添加一个标志 就可 ...

  6. Canny Edge Detector

    Canny边缘检测算法有自己的理论和经验性的推导, 没仔细看/没看明白. 它的步骤如下: 对原图的灰度图进行高斯滤波 求一阶导数, 得到每个像素点的梯度强度和方向. 非最大抑制. 对每个edge ca ...

  7. MyEclipse删除不再使用的工作空间记录

    找到安装目录下的configuration/.settings/org.eclipse.ui.ide.prefs文件,打开此文件,删除不再使用的工作空间信息,重启MyEclipse.然后在切换工作空间 ...

  8. Spring Assert 断言

    Assert(断言)的初步理解构思 Web 应用在接受表单提交的数据后都需要对其进行合法性检查,如果表单数据不合法,请求将被驳回.类似的,当我们在编写类的方法时,也常常需要对方法入参进行合 法性检查, ...

  9. selenium3各种报错解决办法

    解决办法全在这个链接里 http://learn-automation.com/use-firefox-selenium-using-geckodriver-selenium-3

  10. iOS中通知中心(NSNotificationCenter)的使用总结

    一.了解几个相关的类 1.NSNotification 这个类可以理解为一个消息对象,其中有三个成员变量. 这个成员变量是这个消息对象的唯一标识,用于辨别消息对象. @property (readon ...