最近在修改公司的一个bug，需要把左边的东西移动要右边，后来查了下资料，写出了下面的代码。
<html>
<head>
<title>左右移动下拉列表框中的值</title>
<script type="text/javascript" src="jquery-1.2.6.min.js"></script>
<script language="javascript">
function changeObject(s,t){
var objs="#"+s;
var objt="#"+t;
$("option:selected",objs).clone().appendTo(objt);
$("option:selected",objs).remove();
}
</script>
</head>
<body>
<table align="center">
<tr>
<td>
所有人的姓名：<br/>
<select style="width:300px" multiple="multiple" name="allSelect" id="allSelect"
ondblclick="changeObject(this.id,'choseSelect');">
<option>赵一</option>
<option>钱二</option>
<option>张三</option>
<option>李四</option>
<option>王五</option>
<option>孙六</option>
<option>周七</option>
<option>吴八</option>
</select>
</td>
<td width="10%">
<input type="button" name="btn1" value=" >> " onclick="changeObject('allSelect','choseSelect')"/><br/>
<input type="button" name="btn2" value=" << " onclick="changeObject('choseSelect','allSelect')"/>
</td>
<td>
请选择需要添加的人：<br/>
<select style="width:300px" multiple="multiple" name="choseSelect" id="choseSelect"
ondblclick="changeObject(this.id,'allSelect');">
</select>
</td>
</tr>
</table>
</body>
</html>
分享到：
相关推荐
在本篇教程中，我们将深入探讨如何利用jQuery库来实现一个功能丰富的下拉列表左右选择交互。jQuery是一款广泛使用的JavaScript库，它简化了DOM操作、事件处理和动画效果，使得前端开发变得更加高效和便捷。本章节...
在“jquery自动滚动下拉列表框.zip”这个项目中，我们聚焦于一个特定的用户界面元素——下拉列表框，并探讨如何使用jQuery实现自动滚动的效果。这个功能通常用于创建动态、交互性更强的网页应用。 首先，我们需要...
本知识点将详细讲解如何使用jQuery创建一个基于div的下拉框，实现下拉列表的功能。 首先，理解jQuery的核心概念。jQuery通过选择器选中DOM元素，然后对这些元素进行操作。例如，`$("#myDiv")`会选中ID为"myDiv"的...
而使用jQuery实现的平滑移动下拉导航菜单则能为用户提供更佳的浏览体验，这种技术通常用于构建响应式、动态且具有视觉吸引力的网站。本文将深入探讨jQuery平滑移动下拉导航菜单的实现原理、关键代码以及实际应用。 ...
`div模拟select自定义下拉列表框`是一种常见做法，它利用JavaScript（如jQuery）和CSS来实现，可以提供比原生`<select>`元素更丰富的样式控制和交互体验。本篇将详细介绍这种技术及其应用。 一、为什么使用div模拟...
总的来说，"jQuery手机移动端下拉列表选择代码"是一个旨在提升移动设备上选择列表用户体验的解决方案。它利用jQuery的强大功能，结合现代前端开发最佳实践，提供了美观、易用且高性能的下拉列表组件。在开发移动端...
这个函数的目的是让这些下拉列表之间建立联动关系，即当用户在一个下拉列表中做出选择时，其他关联的下拉列表会根据这个选择动态更新其选项。 具体实现过程如下： 1. **HTML结构**：首先，我们需要在HTML页面中...
例如，当用户输入关键词时，可以实时从服务器获取匹配的选项并显示在下拉列表中。 6. **响应式设计**：在当前的Web环境中，移动设备的使用越来越广泛，因此自定义下拉列表框也应具备响应式设计。使用jQuery，我们...
这个名为"jQuery多级下拉菜单支持多级下拉列表菜单"的资源，就是专门为商城网站或企业网站设计的一种实现方式。 jQuery多级下拉菜单的核心在于利用CSS样式定义菜单结构，然后通过jQuery的事件监听和DOM操作来控制...
2. **数据绑定**：将数据源（如数组）绑定到下拉列表中，更新选项。 3. **事件监听**：注册事件处理器，监听用户的选择变化，如`onChange`事件。 4. **交互控制**：提供方法来动态添加、删除选项，或者获取当前...
本项目聚焦于一个基于jQuery的下拉多级树选择插件，该插件具备左右移动功能和模糊搜索特性，极大地提高了用户在下拉列表中的操作效率。 首先，我们来深入理解这个插件的核心特点： 1. **多级树结构**：此插件能够...
总的来说，"jQuery手机顶部下拉搜索框代码"提供了一种实用的解决方案，用于在移动设备上创建一个易于访问且节省空间的搜索功能。通过熟练运用jQuery，开发者能够创建出更加互动和吸引人的网页，提高用户的浏览体验。...
在移动端选择银行下拉列表的应用中，jQuery负责处理用户交互，比如点击事件和触摸滑动事件，同时提供平滑的动画效果。 对于"选择下拉列表"这个标签，我们可以知道这个插件的核心功能是处理下拉列表。在网页开发中，...
combo-select是一款jQuery支键盘控制和列表选项搜索的下拉列表框jQuery插件。该下拉列表框插件支持键盘控制，支持在列表选项中进行搜索过滤。在移动数据和平板电脑上会回退为原生的select列表框。
为了让下拉列表在鼠标移动到搜索框上时保持显示，我们可以添加`mouseenter`和`mouseleave`事件： ```javascript $('#searchInput').on('mouseenter', function() { $('#searchScope').show(); }).on('mouseleave',...
"jQuery手机大众点评下拉菜单选择特效"是将JavaScript库jQuery应用于大众点评的移动应用中，为用户提供了直观、易于操作的菜单选择功能。这篇文章将深入探讨这个特效背后的关键技术和实现原理。 首先，jQuery是一个...
6. **响应式设计**：考虑到移动设备的广泛使用，好的下拉列表框插件会具备响应式布局，自动适应不同屏幕尺寸，确保在手机和平板等设备上也能正常使用。 7. **自定义动画效果**：为了增加用户体验，插件可能包含一些...
2. 事件监听：当用户在一个下拉列表中做出选择时，我们需要监听这个事件，并根据选择的值更新另一个下拉列表。JavaScript提供了多种事件处理方式，如`addEventListener()`，可以在事件触发时执行特定的函数。 3. ...