<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <style>

        div, div button {

            display: inline-block;

            float: left;

        }

        #button {

            margin: 10px 10px;

        }

    </style>

</head>

<body>

<div>

    <select name="" id="eg1" multiple>

        <option value="">nihao1</option>

        <option value="">nihao2</option>

        <option value="">nihao3</option>

        <option value="">nihao4</option>

    </select>

</div>

<div id="button">

    <button id="select_all" type="button"> ></button>

    <br>

    <button id="cancel_all" type="button"> <</button>

</div>

<div>

    <select id="eg2" multiple>

        <option value="">hah1</option>

        <option value="">hah2</option>

    </select>

</div>

<script src="jquery-3.3.1.js"></script>

<script>

    // 选中全部

    $('#select_all').click(function () {

        $('#eg2').append($('#eg1>option'));

    });

    // 取消全部

    $('#cancel_all').click(function () {

        $('#eg1').append($('#eg2>option'));

    });

    // 双击选中

    $('#eg1').on('dblclick', 'option', function () {

        $('#eg2').append($(this));

    });

    // 双击取消

    $('#eg2').on('dblclick', 'option', function () {

        $('#eg1').append($(this));

    });

</script>

</body>

</html>

jQuery动态绑定事件（左右移动）的更多相关文章

  1. jquery - 动态绑定事件

    举个例子: html页面 <div><button type="button" class="test">测试</button&g ...

  2. jquery动态绑定事件

    什么是动态绑定? 动态绑定是指动态添加的DOM节点或者html元素,他们最开始时运行的时候是不存在的.如果要给这些动态加入的节点增加事件,就必须要用jquery的on方法来绑定事件. $('.cont ...

  3. $("#XXX").click()和$("#YYY").on("click","指定的元素",function(){});的区别(jQuery动态绑定事件)

    //绑定 下一页 的点击事件 $("a[aria-label='Next']").click(function(){ $("a[aria-label='Previous' ...

  4. Jquery中$("").事件()和$("").on("事件","指定的元素",function(){});的区别(jQuery动态绑定事件)

    这个是在学习时不懂的问题,记录下来方便查看 转至https://www.cnblogs.com/mr-wuxiansheng/p/7136864.html //绑定 下一页 的点击事件 $(" ...

  5. jquery json遍历和动态绑定事件

    <div id='tmpselectorList' style='border: 1px solid grey;max-height: 150px;position:absolute;text- ...

  6. jQuery的动态绑定事件的应用

    注意:bind()的事件绑定是只对当前页面选中的元素有效.如果你想对动态创建的元素bind()事件,是没有办法达到效果的 <script src="jquery-1.11.2.min. ...

  7. [转]使用 jQuery Mobile 与 HTML5 开发 Web App —— jQuery Mobile 事件详解

    在前文<使用 jQuery Mobile 与 HTML5 开发 Web App —— jQuery Mobile 默认配置与事件基础>中,Kayo 对 jQuery Mobile 事件的基 ...

  8. jquery 动态绑定bind()及模拟鼠标点击A链接

    近来自觉前端有小小进步,幸而记之. 1.两个 css class 紧挨在一起 则在html元素中,要同时拥有这两个class,才能起作用 .block.db{ background-image:url ...

  9. jQuery的事件绑定与触发 - 学习笔记

    jQuery的事件绑定与触发 事件绑定 自动触发事件 常用的鼠标事件 事件冒泡和默认行为 事件冒泡 默认行为 获得当前鼠标的位置和按键 jQuery的事件绑定与触发 事件绑定 基本绑定 $(eleme ...

随机推荐

  1. C语言string.h中常用字符函数介绍

    原文:http://www.cnblogs.com/xuwenmin888/archive/2013/05/03/3057883.html strcpy 函数名: strcpy 功 能: 拷贝一个字符 ...

  2. Dapper 批量操作sql

    static void Main(string[] args) { private static readonly string sqlconnection =""; //遍历循环 ...

  3. js常用代码记录

    1.动态key得到某对象中相对应的value js中想根据动态key得到某对象中相对应的value的方法有二: var key = "name1";var value = obj[ ...

  4. MVC5中Model设置属性注解

    ASP.NET MVC5中Model层开发,使用的数据注解有三个作用: 数据映射(把Model层的类用EntityFramework映射成对应的表) 数据验证(在服务器端和客户端验证数据的有效性) 数 ...

  5. MUI实现上拉加载和下拉刷新

    编写存储过程分页(此处使用T-SQL) CREATE PROC [dbo].[Common_PageList] ( @tab nvarchar(max),---表名 @strFld nvarchar( ...

  6. [问题记录]cocos的lua绑定安装pyyaml报错

    描述:按照readme中的文档操作报错,提示python2.7没有安装,但是确实已经安装了,而且也设置环境变量成功了. 解决: 在D盘新建register.py的文件,内容如下: # # script ...

  7. Thrift学习笔记—IDL基本类型

    thrift 采用IDL(Interface Definition Language)来定义通用的服务接口,并通过生成不同的语言代理实现来达到跨语言.平台的功能.在thrift的IDL中可以定义以下一 ...

  8. XML布局之路

    XML布局存放在工程文件的res/layout目录下.安卓和PC端的界面布局有用到. 常用的布局方式,线性布局:LinearLayout 表格布局:TableLayout 帧布局  :FrameLay ...

  9. 解决Unity3D操作界面字体模糊的问题

    新装的电脑安装了UNITY后,操作界面的字体异常模糊,搜了半天看看有没有换字体的功能,也没找到 后来快放弃的时候,偶然看到这篇文章http://eyehere.net/2014/unity3d-int ...

  10. 时间函数应用　time

    表 1. C 时间函数 function 定义 含义 返回值 精度 time() time 函数获得从 1970 年 1 月 1 日 0 点到当前的秒数,存储在time_t结构之中. time_t 秒 ...