<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>下拉框移动</title>
    <script src="js/jquery-3.2.1.min.js"></script>
    <style>
        .all{
            width: 700px;
            height:500px;
        }
        .left{
            margin-left: 50px;
            margin-top: 100px;
            width: 200px;
            height:100px;
            float: left;
        }
        .mod{
            margin-top: 100px;
            margin-left: 100px;
            width: 100px;
            height: 100px;
            float: left;
        }
        .right{
            margin-top: 100px;
            width:200px;
            height:100px;
            float: right;
        }
        select{
            width:200px;
            height:100px;
        }
    </style>
    <script>
        $(function () {
            $(".leftbtn").click(function () {
                $(".rightsel").append($(".leftsel > option:selected"));
            });
            $(".reghtbtn").click(function () {
                $(".rightsel > option:selected").appendTo($(".leftsel"));
            });
        });

    </script>
</head>
<body>
<div class="all">
<div class="left">
    <select multiple="multiple" class="leftsel">
        <option>山东</option>
        <option>山西</option>
        <option>陕西</option>
        <option>北京</option>
        <option>上海</option>
    </select>
</div>
<div class="mod">
    <br>
    <input type="button" value="-->" class="leftbtn"><br><br><br>
    <input type="button" value="<--" class="reghtbtn">
</div>
<div class="right">
    <select class="rightsel" multiple="multiple">
        <option>江苏</option>
    </select>
</div>
</div>
</body>
</html>

下拉框移动 jquery的更多相关文章

  1. div模拟的下拉框特效jquery

    从网上找来的,感觉不错就拿来分享下 <style type="text/css"> body, ul, li { margin: 0; padding: 0; font ...

  2. 一句话美化你的下拉框之jQuery.selectMM插件

    之前很喜欢 jquery.Dropkick 这个老外美化框插件,但是:IE情况下如果数据多滚动条出现的时候就滚不了,作者也没修复 于是准备自己写一款(确切的说是修改一款吧!!).这款插件是在16素材网 ...

  3. 单选框和下拉框的jquery操作

    单选框 <input type="radio" name="rdSendType" value="email" checked=&qu ...

  4. select下拉框插件jquery.editable-select

    项目中有个需求,下拉框既可以下拉选择,也可以手动填写 html代码 <span>数据来源</span> </select> js代码 $('#noMean').ed ...

  5. Select级联菜单，用Ajax获取Json绑定下拉框（jQuery）

    需求类似这样  ↓ ↓ ↓   -->    菜单A发生变化,动态取数据填充下拉菜单B. JS代码如下: <script type="text/javascript"& ...

  6. javaScript基础练习题-下拉框制作(JQuery)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  7. jQuery插件实现select下拉框左右选择_交换内容（multiselect2side）

    效果图: 使用jQuery插件---multiselect2side做法: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitio ...

  8. jQuery的下拉框应用

    jQuery的下拉框应用 jQuery的下拉框左右选择应用 直接上代码 <!DOCTYPE html> <html> <head> <meta charset ...

  9. js 下拉框效果

    <script type="text/javascript"> window.onload = function () { ]; ]; var aLi = oSub.g ...

随机推荐

  1. 【Python成长之路】词云图制作

    [写在前面] 以前看到过一些大神制作的词云图 ,觉得效果很有意思.如果有朋友不了解词云图的效果,可以看下面的几张图(图片都是网上找到的): 网上找了找相关的软件,有些软件制作 还要付费.结果前几天在大 ...

  2. RestTemplate常用的get和post带参数请求

    在RestTemplate提供的方法中,有一个参数就是目标URL,参数是跟在后面的一个数量可变参数,但是在这里就有个问题,这个方法怎么知道我传的参数值是对应在目标接口的哪个参数的呢: public & ...

  3. 2019 牛客国庆集训派对day1-C Distinct Substrings(exkmp+概率)

    链接:https://ac.nowcoder.com/acm/contest/1099/C来源:牛客网 时间限制:C/C++ 1秒,其他语言2秒 空间限制:C/C++ 32768K,其他语言65536 ...

  4. Python 如何定义只读属性？【新手必学】

    前言本文的文字及图片来源于网络,仅供学习.交流使用,不具有任何商业用途,版权归原作者所有,如有问题请及时联系我们以作处理.作者:Daniel2333如果还没学到属性问题,看不懂不怪你,可以先去小编的P ...

  5. art-template循环无法显示出数据

    art-template循环遍历无法显示数据原因 1.语法问题:循环语句导致的问题 2.插件问题: 用标准语法时循环数据如果引入第一个插件,会导致数据显示不出来只有引入第二个插件才可循环出数据 用原生 ...

  6. 【MobX】MobX 简单入门教程

    一.MobX 介绍 首先看下官网介绍: MobX 是一个经过战火洗礼的库,它通过透明的函数响应式编程(transparently applying functional reactive progra ...

  7. Python利用PyExecJS库执行JS函数

      在Web渗透流程的暴力登录场景和爬虫抓取场景中,经常会遇到一些登录表单用DES之类的加密方式来加密参数,也就是说,你不搞定这些前端加密,你的编写的脚本是不可能Login成功的.针对这个问题,现在有 ...

  8. HDFS的架构和设计要点

    HDFS的架构和设计要点 转 大数据之路 发布于 2012/10/11 23:00 字数 4487 阅读 495 收藏 1 点赞 0 评论 0 撸了今年阿里.头条和美团的面试,我有一个重要发现.... ...

  9. 4个点让你彻底明白Redis的各项功能

    前言 先看一下Redis是一个什么东西.官方简介解释到: Redis是一个基于BSD开源的项目,是一个把结构化的数据放在内存中的一个存储系统,你可以把它作为数据库,缓存和消息中间件来使用.同时支持st ...

  10. django----Sweetalert bulk_create批量插入数据 自定义分页器

    目录 一.Sweetalert使用AJAX操作 二.bulk_create 三.分页器 divmod 分页器组件 自定义分页器的使用 一.Sweetalert使用AJAX操作 ​ sweetalert ...