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

左边选中加到右边:

$("#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# LUA 闭包

    许多语言中有闭包的概念,C#的闭包以lambda表达式表现,可以实现与LUA完全一样的效果. //LUA------------------------------------------------ ...

  2. 解决VC几个编译问题的方法——好用

    一.vc网络编程中遇到一个编译问题,原来是少了WSOCK32.LIB. 在 project-->settings-->Link-->Object/Library modules 中加 ...

  3. UISwitch和UIActivity的使用

    - (void)viewDidLoad{    [super viewDidLoad];    //创建一个开关控件,苹果给它固定的size(79*27),frame更改size无效    //继承于 ...

  4. Pjax.js防刷新技术

    自我感觉良好,所以拿出现在自己用的 Pjax.js 分享给大家 当然 这个版本是 经过本人修改后的版本,跟其它 拿过来就用的 不一样 而且区别还不小 大多的 Pjax 都是 跟后台无关的,而这个版本是 ...

  5. Bootstrap系列 -- 32. 按钮垂直分组

    实际运用当中,总会碰到垂直显示的效果.在Bootstrap框架中也提供了这样的风格.我们只需要把水平分组的“btn-group”类名换成“btn-group-vertical”即可. <div ...

  6. Enum扩展及MVC中DropDownListFor扩展方法的使用

    public enum SearchState { /// <summary> /// 全部 /// </summary> [Description("全部" ...

  7. sql脚本比较大,sqlserver 无法导入,就用cmd命令执行

    osql简单用法:用来将本地脚本执行,适合sql脚本比较大点的情况,执行起来比较方便 1 osql -S serverIP -U sa -P 123 -i C:\script.sql serverIP ...

  8. [工具类]获取url中参数列表

    写在前面 在项目中经常用到解析url中参数的逻辑,今天先下载就自己封装了一个方法,方便以后使用的时候,信手拈来.当然这里给出的方法是针对常见的url参数类型的,对于重写url,或者路由格式的不考虑. ...

  9. [c#基础]值类型和引用类型的Equals,==的区别

    引言 最近一个朋友正在找工作,他说在笔试题中遇到Equals和==有什么区别的题,当时跟他说如果是值类型的,它们没有区别,如果是引用类型的有区别,但string类型除外.为了证实自己的说法,也研究了一 ...

  10. PHP中的日期加减方法示例

    几乎所有从事程序开发的程序员都遇到时间处理问题,PHP开发也一样,幸运的是PHP提供了很多关于日期时间函数.只要经常使用这些函数,搭配使用,日期时间处理上就熟能生巧了. 今天要讲的这个例子,需求是这样 ...