<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<script language="JavaScript">
<!--
function addSrcToDestList() {
destList = window.document.forms[0].destList;
srcList = window.document.forms[0].srcList;
var len = destList.length;
for(var i = 0; i < srcList.length; i++) {
if ((srcList.options[i] != null) && (srcList.options[i].selected)) {
var found = false;
for(var count = 0; count < len; count++) {
if (destList.options[count] != null) {
if (srcList.options[i].text == destList.options[count].text) {
found = true;
break;
}
}
}
if (found != true) {
destList.options[len] = new Option(srcList.options[i].text);
len++;
}
}
}
}
function deleteFromDestList() {
var destList = window.document.forms[0].destList;
var len = destList.options.length;
for(var i = (len-1); i >= 0; i--) {
if ((destList.options[i] != null) && (destList.options[i].selected == true)) {
destList.options[i] = null;
}
}
}
var array=new Array();
array[0]='<option value="系统管理员">系统管理员</option><option value="安检科采煤科长">安检科采煤科长</option>'
array[1]='<option value="安检科科长">安检科科长</option>'
array[2]='<option value="安装队责任人">安装队责任人</option>'
array[3]='<option value="供应科内业科长">供应科内业科长</option><option value="机电科科长">机电科科长</option>'
function change(w){
str='<select style="width:100;font-size:13px" size="5" name="srcList" multiple onchange="javascript:addSrcToDestList()">'
str+=array[w]
str+='</select>'
sList.innerHTML=str
}
</SCRIPT>
</head>
<body>
<center>
<form method="POST">
<table bgcolor="#FFFFCC">
<tr>
<td align="center">
收件人列表:
</td>
<td>
已选收件人:
</td>
</tr>
<tr>
<td bgcolor="#FFFFCC" width="400">
<select style='width:100;font-size:13px' id="subList" size="5" name="subList" multiple onChange="javascript:change(subList.value);event.cancelBubble=true;return false">
<option value="0">安检科</option>
<option value="1">调度室</option>
<option value="2">培训科</option>
<option value="3">生产科</option>
<option value="4">巷修二队</option>
<option value="5">财务科</option>
</select>
<span id="sList">
<select style='width:100;font-size:13px' size="5" name="srcList" multiple onChange="javascript:addSrcToDestList()">
</select>
</span>
</td>
<td bgcolor="#FFFFCC" width="69">
<select style='width:100;font-size:13px' size="5" name="destList" multiple>
</select>
</td>
</tr>
<tr>
<td colspan="3" align="center">
</td>
</tr>
<tr>
<td align="center">
<input type="button" value=" 确定 " onClick="">
</td>
<td>
<input type="button" value=" 从右边删除 " onClick="javascript:deleteFromDestList();">
</td>
</tr>
</table>
</form>
</body>
</html>
分享到:
相关推荐
JavaScript二级联动菜单是一种常见的网页交互设计,用于提供更精细化的导航或数据筛选。在电子商务网站、行政管理系统等中,我们经常可以看到这种菜单形式,它能够根据用户在一级菜单中的选择,动态加载并显示相应的...
javascript二级联动表单javascript二级联动表单javascript二级联动表单javascript二级联动表单javascript二级联动表单javascript二级联动表单javascript二级联动表单javascript二级联动表单
javascript 二级联动菜单
根据给定的信息,我们可以提取并总结出关于“JavaScript 二级联动下拉列表”的知识点: ### 一、二级联动下拉列表概述 二级联动下拉列表是一种常见的网页交互设计模式,通常用于显示具有层级关系的数据。当用户在...
javascript实现二级的省份城市联动。 var aprovince = [ ["--请选择省份--"], ["北京"], ["上海"], ["广东"], ["湖南"] ]; var acity = [ ["--请选择城市--"], ["东城区","西城区","南城区","北城区"], [...
这个是个javascript的二级联动的好例子,希望可以给大家帮助
在ASP中,二级联动和三级联动下拉框是常见的功能,通常用于实现数据的筛选和过滤,例如在地区选择、商品分类等场景。下面将详细讲解如何在ASP中实现这些功能。 ### 二级联动下拉框 二级联动下拉框是指两个下拉框...
而“二级联动.htm”文件可能是HTML模板,展示了二级联动的结构和样式,它可能会包含JavaScript代码来处理客户端的交互逻辑,如监听一级菜单的改变事件,触发对服务器的请求,并更新二级菜单的内容。 总的来说,这个...
在网页开发中,二级联动...总结来说,JavaScript实现二级联动下拉框的关键在于监听父级下拉框的改变事件,根据用户选择的数据动态更新子级下拉框的选项。通过合理的数据结构和异步处理,可以实现灵活且高效的联动效果。
根据提供的信息,我们可以了解到这份材料主要讲解了如何使用JavaScript实现二级联动效果。下面将详细解释这一知识点,并结合给出的部分代码进行分析。 ### JavaScript 实现二级联动 #### 一、二级联动概念 二级...
本文将详细介绍如何使用JavaScript和React实现二级联动,特别是左右联动的效果。 首先,我们看到代码导入了`Component`组件,并引入了自定义样式文件`linkage.less`。`Linkage`类是React中的一个组件,它扩展了`...
3. 调用插件:在需要实现二级联动的页面模板中,插入插件调用代码,确保两个下拉列表的ID正确,以便JavaScript可以正确识别和绑定事件。 4. 数据库准备:确保数据库中有正确的关联数据,比如省份和城市的数据,这样...
在IT行业中,二级联动是一种常见的交互设计,尤其在网页表单和数据筛选中十分常见。本文将详细讨论“下拉框二级联动”这一主题,以及如何利用AJAX和JSON技术来实现这一功能。 首先,我们要理解什么是二级联动。在...
7. **更新页面**:JavaScript函数接收到服务器返回的数据后,动态更新二级联动的选项,显示新的城市列表。 在实际开发中,我们还需要考虑错误处理、数据安全(防止SQL注入)、性能优化(如使用存储过程、缓存查询...
二级联动菜单 参考 javascript,为对二级菜单陌生的程序员提供范例。
二级联动的核心在于监听第一个下拉列表的`onChange`事件,当用户在第一个下拉列表中选择一个选项时,触发该事件,通过JavaScript获取当前选中的索引或值,然后根据这个信息动态地更新第二个下拉列表的选项。...
在IT行业中,"php+ajax 二级联动"是一种常见的前端交互技术,主要用于构建动态、无刷新的用户界面。这种技术可以提升用户体验,因为用户在选择一个选项时,无需等待整个页面刷新,就能实时看到下级选项的变化。接...
在IT领域,二级联动是一种常见的交互设计,常用于网页表单中,特别是在选择项关联的情况下。例如,当你选择一个省份时,城市会根据所选省份动态更新。这种效果可以通过JavaScript库,如jQuery,配合JSON数据来实现。...
总的来说,HTML二级联动下拉列表框的实现涉及HTML、JavaScript以及数据管理,通过监听用户交互,动态更新页面内容,为用户提供更便捷、个性化的操作体验。这种技术在网页表单、地图选择等场景中广泛使用。
在IT领域,二级联动菜单是一种常见的用户界面设计元素,它常用于导航或数据筛选,特别是在网站和应用程序中。二级联动菜单通常由两个关联的下拉菜单组成,其中一个菜单的选择会影响另一个菜单的内容。这种交互设计...