如图,可以通过中间的按钮将左边选中的选项添加到右边,或者全部添加到右边,也可通过双击添加。反之也可以。

左边选中加到右边:

$("#add").click(function(){  //添加按钮点击事件
var op = $("#select1 option:selected"); //获取选中的选项
op.appendTo("#select2"); //把选中的选项添加到右边的select中,appendTo可以删除左边的并添加到右边
});

左边全部添加到右边:

$("#add-all").click(function(){  //添加全部按钮点击事件
var op = $("#select1 option"); //获取全部选项
op.appendTo("#select2"); //全部添加到右边的select
});

双击添加到右边:

$("#select1").dblclick(function(){  //给select1添加双击事件
var op = $("option:selected", this) //获取选中的选项,注意写法
op.appendTo("#select2"); //追加给select2
});

锋利的jQuery-5--下拉框的应用(看写法)的更多相关文章

  1. jquery div 下拉框焦点事件

    这章与上一张<jquery input 下拉框(模拟select控件)焦点事件>类似 这章讲述div的焦点事件如何使用 div的焦点事件与input的焦点事件区别在于 需要多添加一个属性: ...

  2. Jquery操作下拉框(DropDownList)实现取值赋值

    Jquery操作下拉框(DropDownList)想必大家都有所接触吧,下面与大家分享下对DropDownList进行取值赋值的实现代码 1. 获取选中项: 获取选中项的Value值: $('sele ...

  3. jquery 获取下拉框值与select text

    下面先介绍了很多jquery获取select属性的方法,同时后面的实例我们讲的是jquery 获取下拉框值与select text代码. 下面先介绍了很多jquery获取select属性的方法,同时后 ...

  4. jQuery对下拉框Select操作总结

    jQuery对下拉框Select操作总结 转自网络,留做备用 jQuery获取Select元素,并选择的Text和Value: 1. $("#select_id").change( ...

  5. js,jquery获取下拉框选中的option

    js获取select选中的值: var sel=document.getElementById("select1"); var index = sel.selectedIndex; ...

  6. Jquery操作下拉框(DropDownList)的取值赋值实现代码(王欢)

    Jquery操作下拉框(DropDownList)的取值赋值实现代码(王欢) 1. 获取选中项: 获取选中项的Value值: $('select#sel option:selected').val() ...

  7. jQuery操作下拉框的text值和val值

    jQuery操作下拉框的text值和val值 1,JS源码 <select name="select1" id="select1" style=" ...

  8. jquery获得下拉框值的代码

    jquery获得下拉框值的代码   获取Select :  获取select 选中的 text :  $("#ddlRegType").find("option:sele ...

  9. 基于jQuery select下拉框美化插件

    分享一款基于jQuery select下拉框美化插件.该插件适用浏览器:IE8.360.FireFox.Chrome.Safari.Opera.傲游.搜狗.世界之窗.效果图如下: 在线预览   源码下 ...

  10. jQuery的下拉框应用

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

随机推荐

  1. C语言 函数理解(以数组做参数)

    #define _CRT_SECURE_NO_WARNINGS #include<stdio.h> #include<stdlib.h> int run(int *p){ // ...

  2. Silverlight自定义控件开发:温度计

    由于在实际项目中需要实时显示采集到的空气温湿度,土壤温湿度值,需要用比较显眼并且清楚明了的方式来展示,这里我们准备采用温度计的方式来进行.一方面是因为大家都熟悉这个,知道怎么去看:同时,温度计本身也比 ...

  3. ViewConfiguration.getScaledTouchSlop () 用法

    getScaledTouchSlop是一个距离,表示滑动的时候,手的移动要大于这个距离才开始移动控件.如果小于这个距离就不触发移动控件,如viewpager就是用这个距离来判断用户是否翻页 ViewC ...

  4. 深入了解Ant构建工具 命令

    深入了解Ant构建工具 标签: ant工具任务jarjavaclass 2010-05-29 21:16 1346人阅读 评论(2) 收藏 举报 版权声明:本文为博主原创文章,未经博主允许不得转载. ...

  5. 20135316王剑桥 linux第十周课实验笔记

    关于who 功能说明:显示目前登入系统的用户信息. 语 法:who [-Himqsw][--help][--version][am i][记录文件] 补充说明:执行这项指令可得知目前有那些用户登入系统 ...

  6. Jenkins进阶系列之——03parameterized-trigger插件

    说明:这个插件可以根据已经完成构建的结果,触发新Job或者传递参数. 官方说明:Parameterized Trigger Plugin 安装步骤: 系统管理→管理插件→可选插件→Build Trig ...

  7. php模式设计之 适配器模式

    在这个有没有对象都要高呼“面向对象”的年代,掌握面向对象会给我们带来意想不到的方便.学编程的小伙伴从开始能写几行代码实现简单功能到后来懂得将一些重复的操作组合起来形成一个“函数”,再到后来将“函数”和 ...

  8. C#爬页面总结

    错误的思路是这样的:发送一个访问页面的请求过去,得到一个html页面,然后我要的数据全都在这上面.后来发现不是这样的,也猜到可能是页面加载之后还有js代码的ajax的异步加载,那么问题来了?我是不是要 ...

  9. Javascript基础系列之(七)函数(argument访问函数参数)

    argument是javascript中函数的一个特殊参数,例如下文,利用argument访问函数参数,判断函数是否执行 <script type="text/javascript&q ...

  10. Moqui学习Day2

    用户 本地化  消息和日志门面 用户门面用于管理当前用户和访问,登陆,授权及登出的信息.用户信息包括区域设置,时区以及币种/ec.user.nowTimestamp设置日期. 消息门面用于追踪用户的消 ...