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

左边选中加到右边:

$("#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. Oracle11G安装之后

    本人对oracle还处于摸索阶段,今天安装了一下Oracle11G, 安装之后,后台管理端的登录地址:https://172.16.10.75:1158/em 1.使用之前设置的dba管理员密码账号登 ...

  2. C++哈弗曼编码

    // haffman.cpp : 定义控制台应用程序的入口点. // #include "stdafx.h" #include<iostream> using name ...

  3. JavaScript及其异步实现续:Promise让一切更简单

    在写这篇文章之前,我参考了以下文章.所以我文中的例子都是精准的,而且有循可依.下面抛出例子的链接: Understanding JQuery.Deferred and Promise Deferred ...

  4. 信息安全系统设计基础实验五:简单嵌入式 WEB 服务器实验 (20135229,20135234)

    http://www.cnblogs.com/mqy123/p/5002683.html

  5. iOS项目重构日记

    如何重构 首先,要对程序的一般架构烂熟于心,尤其是MVC,这是基本.还有就是分离存储和网络请求的逻辑. 对于一些常用的控件尽量分离复用,设置开关函数,适当的时候开启,不要的时候关闭,有必要的话还可以 ...

  6. 零散知识记录-Jira的安装

    Jira不支持openjdk,在linux下需要卸载后,装个jdk才行.

  7. (转)Java并发编程:volatile关键字解析

    转:http://www.cnblogs.com/dolphin0520/p/3920373.html Java并发编程:volatile关键字解析 volatile这个关键字可能很多朋友都听说过,或 ...

  8. 给java应用打包

    C:\dollapp\classes> jar -cvf C:\dollapp\deploy\dollapp.jar *.* 上面的jar命令会把 C:\dollapp\classes 下的 所 ...

  9. 网络流量监控工具----iftop

    文章转自:http://www.vpser.net/manage/iftop.html.再次本人只是作为笔记使用,不做其他用途. 日常工作中用它来监控网卡的实时流量,(可以指定网段),反向解析IP.显 ...

  10. SEO 相关知识

    传统SEO 观念 换独立服务器 加硬件 减少http请求,压缩网页体积 css 放页面顶部,js 放页面底部 一个中等规模网站的架构 技术角度 切换不同的 User-agent Chrome 的 Ne ...