[img]http://www.th7.cn/d/file/p/2012/10/13/8f09a23c2b5782be14dc26977f7e1de6.png[/img]
<%@ page language="java" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>选择下拉菜单</title>
</head>
<BODY>
<p>选定一项或多项然后点击添加或移除(按住shift或ctrl可以多选)，或在选择项上双击进行添加和移除。</p>
<form method="post" name="myform">
<table border="0" width="300">
<tr>
<td width="40%">
<select style="WIDTH:100%" name="list1" size="12" ondblclick="moveOption(document.myform.list1, document.myform.list2)" multiple="multiple">
<option value="北京">北京</option>
<option value="上海">上海</option>
<option value="山东">山东</option>
<option value="安徽">安徽</option>
<option value="重庆">重庆</option>
<option value="福建">福建</option>
<option value="甘肃">甘肃</option>
<option value="广东">广东</option>
<option value="广西">广西</option>
<option value="贵州">贵州</option>
<option value="海南">海南</option>
<option value="河北">河北</option>
<option value="黑龙江">黑龙江</option>
</select>
</td>
<td width="20%" align="center">
<input type="button" value="添加" onclick="moveOption(document.myform.list1, document.myform.list2)"><br/>
<br/>
<input type="button" value="删除" onclick="moveOption(document.myform.list2, document.myform.list1)">
</td>
<td width="40%">
<select style="WIDTH:100%" name="list2" size="12" ondblclick="moveOption(document.myform.list2, document.myform.list1)" multiple="multiple">
</select>
</td>
<td>
<button onclick="changepos(list2,-1)" type="button">上移</button>
<br/>
<button onclick="changepos(list2,1)" type="button">下移</button>
</td>
</tr>
</table>
值：<input type="text" name="city" size="40">
</form>
<script language="JavaScript">
<!--
function moveOption(e1, e2){
try{
for(var i=0;i<e1.options.length;i++){
if(e1.options[i].selected){
var e = e1.options[i];
e2.options.add(new Option(e.text, e.value));
e1.remove(i);
i=i-1;
}
}
document.myform.city.value=getvalue(document.myform.list2);
}catch(e){
alert(e);
}
}
function getvalue(geto){
var allvalue = "";
for(var i=0;i<geto.options.length;i++){
allvalue +=geto.options[i].value + ",";
}
return allvalue;
}
function changepos(obj,index){
if(index==-1){
if (obj.selectedIndex>0){
obj.options(obj.selectedIndex).swapNode(obj.options(obj.selectedIndex-1))
}
} else if(index==1){
if (obj.selectedIndex<obj.options.length-1){
obj.options(obj.selectedIndex).swapNode(obj.options(obj.selectedIndex+1))
}
}
}
//-->
</script>
</BODY>
</html>
相关推荐
在这个"js continue学习笔记"中，我们将深入探讨`continue`的工作原理，并通过三个示例来演示其在实际应用中的不同用法。 首先，来看第一个代码片段： ```javascript iNum = 0; for (var i = 1; i ; i++) { iNum+...
在Vue.js的学习过程中，了解JavaScript的基础知识是至关重要的，因为Vue.js是基于JavaScript构建的。以下是一些关于Vue.js和JavaScript核心概念的详细说明： 1. **日期对象**： 在JavaScript中，我们可以使用`Date...
### HTML5高级程序设计学习笔记 #### 一、HTML5新增结构标签 在HTML5中，为了更好地组织页面内容并增强语义性，引入了一系列新的结构标签，这些标签不仅能够帮助开发者更清晰地定义页面的不同部分，同时也为搜索...
《openscales学习笔记8.24》主要涵盖了OpenScales库的使用和理解，这是一个针对地图数据处理和显示的开源工具。在这个学习笔记中，我们将深入探讨OpenScales的源码，以及它如何与工具结合，帮助开发者创建交互式地图...
在这个学习笔记中，我们将重点关注使用WebGL这一Web上的3D图形库来实现彩色立方体的绘制及动态操作，包括旋转、平移和缩放。WebGL基于OpenGL标准，允许在浏览器环境中直接进行硬件加速的3D图形渲染。 首先，`...
Processing的学习笔记中提到了多个函数和概念，这里将详细解释几个关键点： - **ellipse()函数** - ellipse()是Processing中的一个函数，用于绘制圆形和椭圆图形。 - 它具有四种模式，分别是`RADIUS`、`CENTER`、...
通过`RenderWindowInteractor`，你可以与可视化结果进行交互，如旋转、平移和缩放。 6. **运行和交互**：最后，调用`RenderWindow`的`Render`方法开始渲染，然后可以通过`RenderWindowInteractor`进行用户交互。 ...
### JavaScript基础知识概述 #### 一、输出方法与应用 JavaScript 提供了多种方式来输出信息，这些输出方式根据应用场景的不同...这些知识点是学习和掌握 JavaScript 的基石，对于进一步深入学习高级特性也非常重要。
文章目录一、CSS部分1、有序列表、无序列表标记设置2、最小或最大的宽度或者高度3、标签内容溢出问题4、优先级设置二、js部分1、当页面滑动时事件（onscroll）2、鼠标移到某个位置时需要的效果 一、CSS部分 1、有序...
《jsp学习笔记总结（收集）》 在IT领域，Java Server Pages（JSP）是一种用于构建动态网页的技术，它将HTML、CSS、JavaScript等客户端代码与Java代码结合在一起，使得开发者能够轻松地创建数据驱动的Web应用程序。...
在“WebGL学习笔记（一）”中，我们将会探讨WebGL的基本概念、工作原理以及如何开始编写你的第一个WebGL程序。 1. **WebGL基本概念** - **上下文(Context)**：在HTML5中，WebGL是Canvas元素的一个上下文，通过`...
这篇学习笔记将涵盖MapXtreme的基本概念、核心功能、使用方法以及常见问题解决。 1. **基本概念** - 地图对象：MapXtreme中的核心元素，包括地图、图层、图例、比例尺等。 - 数据源：地图数据的来源，如Shapefile...
在JavaScript学习过程中，掌握事件处理是至关重要的。本篇笔记主要介绍了如何利用JavaScript来实现当鼠标经过`div`块时改变其背景色的效果。我们将会分析HTML、JavaScript和CSS三部分的代码，以便理解整个过程。 ...
在本篇JavaScript学习笔记中，我们主要探讨了如何通过JavaScript来创建、添加、移除和操作HTML元素节点。 首先，我们了解了如何创建元素节点。`document.createElement()` 是一个非常重要的方法，它允许我们动态...
- 将复杂的逻辑或计算移到JavaScript中，而非直接在Canvas上，以利用JavaScript的灵活性和性能。 4. **实践与示例** 博文可能提供了实际代码示例，展示如何结合上述技巧实现菜单高亮和像素字体。通过阅读和理解...
### ArcIMS学习笔记知识点梳理 #### 一、常用对象名称说明 在ArcIMS系统中，了解各个对象的作用对于实现特定功能至关重要。以下是几个常见的对象及其用途： 1. **theImage**：表示当前显示的地图图像。 2. **the...
【标题】"H5鼠标移到图片显示星星特效"是一个网页设计中的交互效果，它通过HTML5、CSS3以及JavaScript技术实现。这个效果通常用于增强用户体验，例如在用户将鼠标悬停在图片上时，显示出与图片相关的星星或其他动态...
- **地图搜索**：JavaScript用于实现地图上的交互，如缩放、平移、标记等。 - **网页游戏**：JavaScript可以创建基于浏览器的游戏，处理用户输入和游戏逻辑。 - **用户输入验证**：通过JavaScript可以验证表单...
在Android平台上，动画是提升用户体验的关键元素之一。官方SDK提供了两种主要类型的动画机制：Tween Animation和Frame Animation。Tween Animation主要用于创建基于对象属性变化的动画，例如平移、缩放、旋转和透明...
{5.2.1}将浮点数四舍五入到指定精度}{98}{subsection.5.2.1} {6}Exception}{99}{chapter.6} {6.1}\ttfamily try-catch}{99}{section.6.1} {6.2}\ttfamily finally}{100}{section.6.2} {6.3}\ttfamily throws}{...