两个选择框,双击一下边的数据项,数据项传入另一选择框
<html>
<head>
<script type="text/javascript">
function addDbclick1() {
if(document.all("ListBox1").value==null||document.all("ListBox1").value=="") {
return false;
}
var addOption=document.createElement("option");
var index;
if (document.all("ListBox1").length==0) {
return false;
} else {
index=document.all("ListBox1").selectedIndex;
}
addOption.text=document.all("ListBox1").options(index).text;
addOption.value=document.all("ListBox1").options(index).value;
document.all("ListBox2").add(new Option(addOption.text,addOption.value));
if(!(index<0)) {
document.all("ListBox1").options.remove(index);
}
}
function addDbclick2() {
if(document.all("ListBox2").value==null||document.all("ListBox2").value=="") {
return false;
}
var addOption=document.createElement("option");
var index;
if(document.all("ListBox2").length==0) {
return false;
} else {
index=document.all("ListBox2").selectedIndex;
}
addOption.text=document.all("ListBox2").options(index).text;
addOption.value=document.all("ListBox2").options(index).value;
document.all("ListBox1").add(new Option(addOption.text,addOption.value));
if(!(index<0)) {
document.all("ListBox2").options.remove(index);
}
}
</script>
</head>
<body>
<table border="0" cellpadding="0" cellspacing="0" class="form_info">
<tr>
<td class="chq_ali4" width="15%" >选择用户</td>
<td class="chq_ali5" width="25%">
<select size="4" id="ListBox1" onDblClick="addDbclick1();" style="height:260px;width:200px;">
<option value="1">aaaaa</option>
<option value="1">bbbbb</option>
<option value="1">ccccc</option>
<option value="1">eeeee</option>
<option value="1">ddddd</option>
<option value="1">fffff</option>
<option value="1">sssss</option>
<option value="1">wwwww</option>
<option value="1">rrrrr</option>
</select>
</td>
<td class="chq_ali5" width="58%">
<select name="ListBox2" size="4" id="ListBox2" onDblClick="addDbclick2();" style="height:260px;width:200px;">
</select>
<font color="red">**</font>
</td>
</tr>
</table>
</body>
</html>
分享到：
相关推荐
在上述代码中，有两个`select`元素，用户可以独立选择它们中的任意一个选项。 为了实现互斥选择，我们需要监听`select`元素的`change`事件，当用户更改选择时，取消其他`select`元素的选择状态。我们可以使用...
这个场景中，我们讨论的是如何实现一个功能，让用户可以在两个Select下拉框之间移动选择的值，这种功能常见于多选设置或者数据迁移的界面。下面我们将深入探讨如何实现这样的功能。 首先，我们需要两个HTML Select...
要实现“两个select框的数据移动”，我们需要关注以下几个关键知识点： 1. **事件监听**：首先，我们需要在源`<select>`框上监听`change`事件。当用户做出选择时，这个事件会被触发。此外，如果支持多选，还需监听`...
本项目中，我们看到一个创新的应用，即通过两个`<select>`标签来实现类似“双选框”的功能，这在需要用户从多个选项中选择并分配到不同类别时非常有用。这种设计可以提高用户界面的交互性和效率。 首先，我们要理解...
总结起来，实现“两个select下拉框中的数据相互移动”涉及到HTML、CSS和JavaScript的基本知识，以及对用户交互的响应和处理。实际开发中还需要根据具体需求进行调整和优化，确保用户体验的流畅和功能的完善。
本话题聚焦于使用jQuery来实现两个select元素之间的选中值互换功能。这对于用户界面设计，尤其是在需要双向联动或者数据交换的场景下，是一个实用的功能。 首先，我们要了解HTML中的`<select>`元素。它是创建下拉...
在网页设计中，"select互选效果"是一种交互设计特性，允许用户在两个或多个下拉选择框（`<select>`元素）之间进行双向选择，实现数据的同步更新。这样的功能常见于需要关联两个列表项的场景，比如地区选择、类别筛选...
有两个 select框，且这俩select框是关联的，触发select1，select2里面才会有值。 但是现在的问题是这样的： 触发select1，触发select2，再触发select1，此时select2里面的值变成了上次一选中的value 值，而不会被...
本项目就是利用JavaScript实现的一个功能，允许用户在两个列表框之间以及列表内部移动数据项。以下是对这个程序代码的详细解析： 1. **列表框（List Box）**： 列表框是HTML中的一种常见元素，通常用`<select>`...
实现两个`select`的级联效果也很容易： ```javascript $(".selector1").change(function() { // 清空第二个`select` $(".selector2").empty(); // 循环添加新`option` var option = $("<option>").val(1).text(...
这段代码创建了一个被禁用的`<html:select>`元素，其中包含两个选项，第一个选项的值为0，显示为“通”，第二个选项被禁用且为空。由于`<html:select>`本身被禁用，用户无法进行任何选择操作。 #### 五、总结 `...
在某些场景下，开发者可能需要将这两种组件结合，以满足特定的需求，例如实现一个既具备树状结构又能进行多选或单选功能的选择器。这就是`SelectTree`，一种自定义的`tree-select`组件。 `SelectTree`结合了`Select...
总之，从两个表中查询出不同的数据是一项基础但重要的数据库操作，熟练掌握这些技巧将有助于在数据管理和分析工作中更加游刃有余。同时，要结合实际场景选择合适的查询方式，并考虑查询性能和效率，以确保数据处理的...
在IT领域，数据库同步是...总的来说，同步两个数据库的数据是一项复杂的工作，需要充分理解数据库的特性和同步的原理，以确保数据的一致性和完整性。而“SynOTEXAM”代码提供了这样一个解决方案，值得深入研究和学习。
我们还创建了一个数组`optionsData`来模拟动态获取的数据，然后遍历这个数组，为每个Select元素添加对应的Option。 在实际应用中，这些Option元素可能来源于用户的输入、数据库查询的结果或是其他API的调用。通过...
首先，我们需要创建两个主要部分：一个是`<select>`元素，用于展示新闻标题列表；另一个是`<div>`容器，用于显示新闻内容。 ```html <select onchange="ShowInfo(this.value)"> 第一条新闻标题 第二条新闻标题 ...
今天，我们将深入探讨如何利用Select2和jQuery-ZTree这两个强大的JavaScript库，构建功能丰富的树形下拉框。这种组件在数据层次结构展示、多级选择等方面有着广泛的应用，如在系统配置、权限管理等场景中。 首先，...
这两个文件应当在HTML页面中正确引用，以便Select2库正常工作。 在实际应用中，我们通常会在文档头部引入`select2.min.css`，并在脚本部分引入`select2.min.js`，并确保在DOM加载完成后初始化Select2。例如： ```...
1. 初始化：创建两个select菜单，并填充初始数据。 2. 绑定事件：为每个菜单的`change`事件绑定处理函数。 3. 处理事件：在事件处理函数中，根据用户的选择状态（添加或移除）使用`append()`或`remove()`方法更新另...
这个组件结合了下拉框和模糊查询的功能，使得用户可以通过输入关键字快速找到并选择目标选项，尤其适用于拥有大量数据项的情况。 首先，`combo.select.css` 是样式表文件，它包含了此组件所需的CSS样式规则。这些...