<!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. C# Image Resizer

    This program is used to resize images. using System; using System.Windows.Forms; using System.Drawin ...

  2. vijos-1447 开关灯泡-大整数开方算法

    描述 一个房间里有n盏灯泡,一开始都是熄着的,有1到n个时刻,每个时刻i,我们会将i的倍数的灯泡改变状态(即原本开着的现将它熄灭,原本熄灭的现将它点亮),问最后有多少盏灯泡是亮着的. 提示 范围:40 ...

  3. UEFI与MBR区别

     EFI与MBR启动的区别 大硬盘和WIN8系统,让我们从传统的BIOS+MBR模式升级到UEFI+GPT模式,现在购买的主流电脑,都是预装WIN8系统,为了更好的支持2TB硬盘 ,更快速的启动win ...

  4. MAC中查看Python安装路径

    [admin@admindeMac:~]which  Python /usr/bin/Python

  5. Android出现错误后改正后仍显示错误

    今天编Android的时候,layout.xml出现了错误,改正后仍显示错误.试了很多方法. 后来,将原来的复制并删掉,然后再粘贴上去就可以了.

  6. cmd 下telnet 不是内部或外部命令

    问题:cmd 下telnet 提示不是内部或外部命令 解决方案:

  7. 模块(modue)的概念：

    在计算机程序的开发过程中,随着程序代码越写越多,在一个文件里代码就会越来越长,越来越不容易维护. 为了编写可维护的代码,我们把很多函数分组,分别放到不同的文件里,这样,每个文件包含的代码就相对较少,很 ...

  8. 【BZOJ 4456】【UOJ #184】【ZJOI 2016】旅行者

    http://www.lydsy.com/JudgeOnline/problem.php?id=4456 http://uoj.ac/problem/184 参考(抄)的晨爷的题解(代码) 对矩形进行 ...

  9. Mysql-报错:1130-host ... is not allowed to connect to this MySql server 开放mysql远程连接 不使用localhost

    报错:1130-host ... is not allowed to connect to this MySql server   解决方法: 1. 改表法. 可能是你的帐号不允许从远程登陆,只能在l ...

  10. 6 this的使用方法

    class Person { String name; void talk() { System.out.println("my name is "+this.name); } } ...