如何实现下面这样的效果？
2007-08-30 17:48
<script language=\"JavaScript\">
function copyToList(from,to) //from表示:包含可选择项目的select对象名字 to表示:列出可选择项目的select对象名字 //你可以根据你的具体情况修改
{
fromList = eval('document.forms[0].' + from);
toList = eval('document.forms[0].' + to);
if (toList.options.length > 0 && toList.options[0].value == 'temp')
{
toList.options.length = 0;
}
var sel = false;
for (i=0;i<fromList.options.length;i++)
{
var current = fromList.options[i];
if (current.selected)
{
sel = true;
if (current.value == 'temp')
{
alert ('你不能选择这个项目!');
return;
}
txt = current.text;
val = current.value;
toList.options[toList.length] = new Option(txt,val);
fromList.options[i] = null;
i--;
}
}
if (!sel) alert ('你还没有选择任何项目');
}
function allSelect() //这是当用户按下提交按钮时，对列出选择的select对象执行全选工作，让递交至的后台程序能取得相关数据
{
List = document.forms[0].chosen;
if (List.length && List.options[0].value == 'temp') return;
for (i=0;i<List.length;i++)
{
List.options.selected = true;
}
}
</script>
<table border=\"0\">
<form onSubmit=\"allSelect()\">
<tr>
<td>
<select name=\"possible\" size=\"4\" MULTIPLE width=200 style=\"width: 200px\">
<option value=\"1\">中国广州</option>
<option value=\"2\">中国上海</option>
<option value=\"3\">中国北京</option>
<option value=\"4\">中国武汉</option>
</select>
</td>
<td><a href=\"javascript:copyToList('possible','chosen')\">添加至右方--></a><br><br><a href=\"javascript:copyToList('chosen','possible')\"><--添加至左方</a></td>
<td>
<select name=\"chosen\" size=\"4\" MULTIPLE width=200 style=\"width: 200px;\">
<option value=\"temp\">从左边选择你的地区</option>
</select>
</td>
</tr>
</form>
</table>
2007-08-31 08:48
谢谢 “lmhllr”
2007-08-31 08:52
和tianlebest的一样，我用的是创建节点的方法，可怎么也获取不到sel1中option的文本内容，请朋友们帮忙解答，谢谢
<table width="340">
<tr>
<td align="center" width="120">
<select size="12" style="width:120px" id="sel1">
<option value="品种1">品种1</option>
<option>品种2</option>
<option>品种3</option>
<option>品种4</option>
<option>品种5</option>
<option>品种6</option>
<option>品种7</option>
<option>品种8</option>
<option>品种9</option>
<option>品种10</option>
<option>品种11</option>
<option>品种12</option>
<option>品种13</option>
<option>品种14</option>
<option>品种15</option>
<option>品种16</option>
<option>品种17</option>
<option>品种18</option>
<option>品种19</option>
<option>品种20</option>
</select>
</td>
<td align="center" width="100" valign="middle">
<input type="button" id="but1" value=">>" style="width:50px;" onclick="add('sel2',str)"><br/><br/>
<input type="button" id="but2" value="<<" style="width:50px;">
</td>
<td align="center" width="120">
<select size="12" style="width:120px" id="sel2">
</select>
</td>
</tr>
</table>
<script language="javascript">
var x=document.getElementById("sel1");
var str=x.selectedIndex.value;
function createnew(str)
{
var newElement=document.createElement("option");
var newText=document.createTextNode(str);
newElement.appendChild(newText);
return newElement;
}
function add(nodeId,str)
{
var node=document.getElementById(nodeId);
var newNode=createnew(str);
node.appendChild(newNode);
}
</script>
2007-08-31 17:11
[CODE]<!doctype html public "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="gb2312">
<head>
<title> 下拉列表框多选的效果</title>
<meta http-equiv="content-type" content="text/html;" />
<meta name="generator" content="editplus" />
<meta name="keywords" content="" />
<meta name="description" content="" />
<link type="text/css" rel="stylesheet" href="" />
</head>
<script type="text/javascript">
<!--
function Mv(a,b) {
var i = 0;
var f=document.getElementById(a);
var t=document.getElementById(b);
for(var i=0; i<f.options.length; i++) {
if(f.options[i].selected ) {
var no = new Option();
no.value = f.options[i].value;
no.text = f.options[i].text;
t.options[t.options.length] = no;}
}
Rv(a);
}
function Rv(o) {
var o=document.getElementById(o);
for(var i=o.options.length-1; i>=0; i--) {
if(o.options[i].selected && o.options[i] != "") {
o.options[i].value = "";
o.options[i].text = "";
o.options[i] = null;
}
}
}
-->
</script>
<body>
<table id="MovOpTB" cellspacing="0" cellpadding="0">
<tr>
<td class="slt"><strong class="norTit">我的联系人</strong><br /><select id="SltAddrA" class="SltBar" name="" size="12" multiple="true">
<option value="1">CNLei01 <test@test.com></option>
<option value="2">CNLei02 <test@test.com></option>
<option value="5">CNLei05 <test@test.com></option>
<option value="7">CNLei07 <test@test.com></option>
<option value="9">CNLei09 <test@test.com></option>
<option value="9">CNLei10 <test@test.com></option>
<option value="11">CNLei11 <test@test.com></option>
</select>
</td>
<td class="btn"><input type="button" class="BtnA2w" name="" value=">>>" onclick="Mv('SltAddrA','SltAddrB');" /><br /><br /><input type="button" class="BtnB2w" name="" value="<<<" onclick="Mv('SltAddrB','SltAddrA');" /></td>
<td class="slt"><strong class="norTit">列表成员</strong><br /><select id="SltAddrB" class="SltBar" name="" size="12" multiple="true">
<option value="">CNLei03 <test@test.com></option>
<option value="">CNLei04 <test@test.com></option>
<option value="">CNLei08 <test@test.com></option>
</select></td>
</tr>
</table>
</body>
</html>[/CODE]
2007-09-01 19:41
2007-09-01 19:52