jQuery动态绑定事件(左右移动)
<!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动态绑定事件(左右移动)的更多相关文章
- jquery - 动态绑定事件
举个例子: html页面 <div><button type="button" class="test">测试</button&g ...
- jquery动态绑定事件
什么是动态绑定? 动态绑定是指动态添加的DOM节点或者html元素,他们最开始时运行的时候是不存在的.如果要给这些动态加入的节点增加事件,就必须要用jquery的on方法来绑定事件. $('.cont ...
- $("#XXX").click()和$("#YYY").on("click","指定的元素",function(){});的区别(jQuery动态绑定事件)
//绑定 下一页 的点击事件 $("a[aria-label='Next']").click(function(){ $("a[aria-label='Previous' ...
- Jquery中$("").事件()和$("").on("事件","指定的元素",function(){});的区别(jQuery动态绑定事件)
这个是在学习时不懂的问题,记录下来方便查看 转至https://www.cnblogs.com/mr-wuxiansheng/p/7136864.html //绑定 下一页 的点击事件 $(" ...
- jquery json遍历和动态绑定事件
<div id='tmpselectorList' style='border: 1px solid grey;max-height: 150px;position:absolute;text- ...
- jQuery的动态绑定事件的应用
注意:bind()的事件绑定是只对当前页面选中的元素有效.如果你想对动态创建的元素bind()事件,是没有办法达到效果的 <script src="jquery-1.11.2.min. ...
- [转]使用 jQuery Mobile 与 HTML5 开发 Web App —— jQuery Mobile 事件详解
在前文<使用 jQuery Mobile 与 HTML5 开发 Web App —— jQuery Mobile 默认配置与事件基础>中,Kayo 对 jQuery Mobile 事件的基 ...
- jquery 动态绑定bind()及模拟鼠标点击A链接
近来自觉前端有小小进步,幸而记之. 1.两个 css class 紧挨在一起 则在html元素中,要同时拥有这两个class,才能起作用 .block.db{ background-image:url ...
- jQuery的事件绑定与触发 - 学习笔记
jQuery的事件绑定与触发 事件绑定 自动触发事件 常用的鼠标事件 事件冒泡和默认行为 事件冒泡 默认行为 获得当前鼠标的位置和按键 jQuery的事件绑定与触发 事件绑定 基本绑定 $(eleme ...
随机推荐
- mysql创建用户授权
服务器上好多库,为了不让某用户误操作别人的数据库,给他单独建个用户并授权. insert into mysql.user(Host,User,Password, ssl_cipher, x509_is ...
- IE8下的怪异模式
使用DWZ框架,老是出现点击button后在winxp IE8下出现新页面,经过检查后发现IE8下submit后,return false就不行了,必须使用window.event.returnVal ...
- 形象解释C#、Net、Asp.net
下文是写给计算机小白的,尽量用形象的语言来让她们明白这些比较抽象的概念. -------------------------------------- C#: 你和美国人说话要说英语 和中国人说话说汉 ...
- tcp三次握手和四次挥手(2)
背景描述 通过上一篇中网络模型中的IP层的介绍,我们知道网络层,可以实现两个主机之间的通信.但是这并不具体,因为,真正进行通信的实体是在主机中的进程,是一个主机中的一个进程与另外一个主机中的一个进 ...
- 使用pdb调试python脚本
pdb 是 python 自带的一个包,为 python 程序提供了一种交互的源代码调试功能,主要特性包括设置断点.单步调试.进入函数调试.查看当前代码.查看栈片段.动态改变变量的值等.pdb 提供了 ...
- easyui的解析器Parser
平时使用easyui做框架开发时,都知道easyui的模块组件能通过属性方法或js方法来渲染,本质上是通过parser解析器来处理实现的,因为多数情况下都是自动触发完成整个页面的解析,所以没有感觉到它 ...
- ACM-某大牛的建议
一般要做到50行以内的程序不用调试.100行以内的二分钟内调试成功.acm主要是考算法的,主要时间是花在思考算法上,不是花在写程序与debug上. 下面给个计划你练练: 第一阶段: 练经典 ...
- Asp.net让某一页设置成gb2312或utf-8的方法
有些需求,一定要用到utf-8格式,在web.config里面设置<globalization requestEncoding="utf-8" ...
- mysql5.7
原文 http://imysql.com/2015/07/08/mysql-57-new-feature-part-3.shtml 主题 MySQL 本文将和大家一起分享下5.7的新特性,不过我们要 ...
- Mysql学习---全国省市区以及邮编数据库
更多下载