<!DOCTYPE html>
<html lang="zh-cn">
<head>
 <meta charset="utf-8">
 <title></title>
 <style>

   .centent{
   float:left;
   margin-right: 50px;
  }
 </style>
</head>
<body>
<div class="centent">
 <select multiple id="select1" style="width: 100px;height:160px ">
  <option value="1">选项1</option>
  <option value="2">选项2</option>
  <option value="3">选项3</option>
  <option value="4">选项4</option>
  <option value="5">选项5</option>
  <option value="6">选项6</option>
  <option value="7">选项7</option>
 </select>
 <div>
  <p id="add">选中添加到右边&gt;&gt;</p>
  <p id="add_all">全部添加到右边&gt;&gt;</p>
 </div>
</div>
<div class="centent">
 <select multiple id="select2" style="width: 100px;height:160px ">
 </select>
 <div>
  <p id="remove">&lt;&lt;选中删除到左边</p>
  <p id="remove_all">&lt;&lt;全部删除到左边</p>
 </div>
</div>
</body>
<script src="js/jquery-1.11.3.js"></script>
<script>
 $('#add').click(function(){
  var $options=$('#select1 option:selected');
  $options.appendTo('#select2');
 });
 $('#add_all').click(function(){
  var $options=$('#select1 option');
  $options.appendTo('#select2');
 });
 $('#select1').dblclick(function(){
  var $options=$("option:selected",this);
  $options.appendTo('#select2');
 });
 $('#remove').click(function(){
  var $options=$('#select2 option:selected');
  $options.appendTo('#select1');
 });
 $('#remove_all').click(function(){
  var $options=$('#select2 option');
  $options.appendTo('#select1');
 });
 $('#select2').dblclick(function(){
  var $options=$("option:selected",this);
  $options.appendTo('#select1');
 });
</script>
</html>

Jquery 组 表单select交互选项的更多相关文章

  1. Jquery 组 表单验证

    <!DOCTYPE html><html lang="zh-cn"><head> <meta charset="utf-8&qu ...

  2. form表单select的选项值选择

    html: <form action=""> <p>选择城市</p> <p> <select name="" ...

  3. jQuery formValidator表单验证插件

    什么是jQuery formValidator? jQuery formValidator表单验证插件是客户端表单验证插件. 在做B/S开发的时候,我们经常涉及到很多表单验证,例如新用户注册,填写个人 ...

  4. bootstrap+jQuery.validate表单校验

    谈谈表单校验 这大概是一种惯例,学习前台后台最开始接触的业务都是用户注册和登录.现在社会坚持以人为本的理念,在网站开发过程同样如此.User是我们面对较多的对象,也是较核心的对象.最开始的用户注册和登 ...

  5. （四）Jquery Mobile表单

    Jquery Mobile表单与列表 一.JM表单      1.表单      普通html表单            效果:          2.只能输入数字的表单           效果:  ...

  6. jQuery.validate表单校验+bootstrap

    谈谈表单校验 这大概是一种惯例,学习前台后台最开始接触的业务都是用户注册和登录.现在社会坚持以人为本的理念,在网站开发过程同样如此.User是我们面对较多的对象,也是较核心的对象.最开始的用户注册和登 ...

  7. html基本标签表单实现交互原理，单选框，复选框，下拉框介绍

    表单是什么?表单是前端和服务器做交互的一种机制,表单收集用户输入信息,之后发送或者提交给服务器.用户在输入的信息称之为内容,内容的文本分为普通和密码型,用户通过单选框.复选框.下拉框(也就是下拉菜单) ...

  8. 通过AJAX和PHP，提交JQuery Mobile表单

    File name: callajax.php <?php $firstName = $_POST[firstName]; $lastName = $_POST[lastName]; echo( ...

  9. 雷林鹏分享：jQuery EasyUI 表单 - 过滤下拉数据网格

    jQuery EasyUI 表单 - 过滤下拉数据网格 下拉数据网格(Combogrid)组件和下拉框(Combobox)组件的共同点是,除了都具有下拉面板以外,它们都是基于数据网格(Datagrid ...

随机推荐

  1. github（1）安装及使用图文详解

    教程https://blog.csdn.net/qq_32166627/article/details/54427622 下载地址:https://desktop.github.com/

  2. Arduino IDE for ESP8266教程（四）网页控制灯 简单页面

    修改ssid和passwd,将程序烧写到8266上,等待串口返回连接成功的消息,连接成功之后可以看到返回有一个ip地址,使用浏览器方位这个ip地址就可以看到这个消息: 连接路由器后,返回IP地址 19 ...

  3. JS进阶之---执行上下文，变量对象，变量提升

    一.结构顺序大体介绍 JavaScript代码的整个执行过程,分为两个阶段,代码编译阶段与代码执行阶段. 编译阶段由编译器完成,将代码翻译成可执行代码,这个阶段作用域规则会确定. 执行阶段由引擎完成, ...

  4. ztree树形菜单demo

    阅读目录 zTree树形菜单 回到顶部 zTree树形菜单 树形菜单使用方式如下:HTML引入的方式如下: <!DOCTYPE html> <html> <head> ...

  5. CVE-2016-7912 分析报告

    CVE-2016-7912 背景介绍 在内核USB驱动中,进行异步读取或写入时,调用ki_complete(),会提前释放kiocb结构体,从而造成UAF漏洞,但经过分析,发现无法利用此漏洞进行攻击. ...

  6. 【Codeforces 650 D】Zip-line

    题意:给一个序列以及\(n\)个查询,每一个查询是问(假装)把第\(a_i\)个数改为\(b_i\)之后原序列的最长上升子序列的长度. 思路:线段树优化\(dp\). 肯定离线做啊. 首先我们考虑\( ...

  7. Python 爬取 11 万 Java 程序员信息竟有这些重大发现！

    一提到程序猿,我们的脑子里就会出现这样的画面: 或者这样的画面: 心头萦绕的字眼是:秃头.猝死.眼镜.黑白 T 恤.钢铁直男-- 而真实的程序猿们,是每天要和无数数据,以及数十种编程语言打交道.上能手 ...

  8. Apache Beam: 下一代的大数据处理标准

    Apache Beam(原名Google DataFlow)是Google在2016年2月份贡献给Apache基金会的Apache孵化项目,被认为是继MapReduce,GFS和BigQuery等之后 ...

  9. SQL2005中的事务与锁定（九）-（2）- 转载

    -------------------------------------------------------------------------- Author : HappyFlyStone -- ...

  10. HDU 3400

    一道很适合练习三分的题目三分套三分强不强 题意:给你平面上两条平行线段\(AB\)和\(CD\),一个人要从\(A\)走到\(D\),他在线段\(AB\)上的速度为\(P\),在\(CD\)上的速度为 ...