<SCRIPT LANGUAGE="JavaScript">
function myFun(){
var objLen=document.getElementById("sel1").length;
if(objLen>0){
for(i=0;i<objLen;i++)
{
if(document.getElementById("sel1").options[i].selected==true){
document.getElementById("sel2").options[i].innerText=document.getElementById("sel2").options[i].innerText+"\n"+document.getElementById("sel1").options[i].value;
}
}
}
}
</script><SELECT name='sel1' size=10 multiple="multiple" onchange=myFun()>
<option value="Test1">Test1</option>
<option value="Test2">Test2</option>
<option value="Test3">Test3</option>
<option value="Test4">Test4</option>
<option value="Test5">Test5</option>
<option value="Test6">Test6</option>
<option value="Test7">Test7</option>
<option value="Test8">Test8</option>
<option value="Test9">Test9</option>
</SELECT>
<SELECT name='sel2' size=10 >
<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>
function myFun(){
var objLen=document.getElementById("sel1").length;
if(objLen>0){
for(i=0;i<objLen;i++)
{
if(document.getElementById("sel1").options[i].selected==true){
document.getElementById("sel2").options[i].innerText=document.getElementById("sel2").options[i].innerText+"\n"+document.getElementById("sel1").options[i].value;
}
}
}
}
</script><SELECT name='sel1' size=10 multiple="multiple" onchange=myFun()>
<option value="Test1">Test1</option>
<option value="Test2">Test2</option>
<option value="Test3">Test3</option>
<option value="Test4">Test4</option>
<option value="Test5">Test5</option>
<option value="Test6">Test6</option>
<option value="Test7">Test7</option>
<option value="Test8">Test8</option>
<option value="Test9">Test9</option>
</SELECT>
<SELECT name='sel2' size=10 >
<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>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>两个select之间传值.html</title>
<script type="text/javascript">
function Transfer(Num,argsValue,argsText){
var sel1 = document.getElementById("s1");
sel1.remove(Num);
var sel2 = document.getElementById("s2");
var oOption = document.createElement("option");
sel2.options.add(oOption,parseInt(argsValue));
oOption.text = argsText;
oOption.selected = false;
}
</script>
</head>
<body>
<select id="s1" multiple="multiple" onchange="Transfer(this.selectedIndex,this.value,this.options[selectedIndex].text)" style="width:100px;height:100px">
<option value="1">o1Text</option>
<option value="2">o2Text</option>
<option value="3">o3Text</option>
<option value="4">o4Text</option>
<option value="5">o5Text</option>
</select><select id="s2" multiple="multiple" style="width:100px;height:100px">
</select>
</body>
</html>
<tr>
<td valign=top>
<select name=s1 multiple size=4 style="width:100">
<option value=1>aaaaaa
<option value=2>bbbbbb
<option value=3>cccccc
<option value=4>dddddd
<option value=5>eeeeee
<option value=6>ffffff
<option value=7>gggggg
<option value=8>hhhhhh
</select>
</td>
<td valign=middle align=center>
<input type=button name=b4 value=">" onClick="move(1)"><br>
<input type=button name=b5 value="<" onClick="move(2)">
</td>
<td valign=top>
<select name=s2 multiple size=4 style="width:100">
</select>
</td>
</tr>
<tr>
<td>
<input type=button name=b1 value=向上 onClick="up()">
<input type=button name=b2 value=向下 onClick="down()">
</td>
<td>
<input type=button name=b3 value=查看 onClick="show()">
</td>
<td>
</td>
</tr>
</table><script>
function up() {
s = document.all.s1;
v = new Array();
for(i=0;i<s.length-1;i++) {
if(! s.options[i].selected && s.options[i+1].selected) {
v.value = s.options[i].value;
v.text = s.options[i].text;
v.selected = s.options[i].selected;
s.options[i].value = s.options[i+1].value;
s.options[i].text = s.options[i+1].text;
s.options[i].selected = s.options[i+1].selected;
s.options[i+1].value = v.value;
s.options[i+1].text = v.text;
s.options[i+1].selected = v.selected;
}
}
}function down() {
s = document.all.s1;
v = new Array();
for(i=s.length-1;i>0;i--) {
if(! s.options[i].selected && s.options[i-1].selected) {
v.value = s.options[i].value;
v.text = s.options[i].text;
v.selected = s.options[i].selected;
s.options[i].value = s.options[i-1].value;
s.options[i].text = s.options[i-1].text;
s.options[i].selected = s.options[i-1].selected;
s.options[i-1].value = v.value;
s.options[i-1].text = v.text;
s.options[i-1].selected = v.selected;
}
}
}function show() {
s = document.all.s1;
v = "";
for(i=0;i<s.length;i++)
v += s.options[i].value + ":" + s.options[i].text + "\n";
alert(v);
}function move(m) {
if(m == 1) {
ss1 = document.all.s1;
ss2 = document.all.s2;
}
if(m == 2) {
ss1 = document.all.s2;
ss2 = document.all.s1;
}
v = new Array();
k = 0;
for(i=0;i<ss1.length;i++) {
if(ss1.options[i].selected) {
ss2.options[ss2.length] = new Option(ss1.options[i].text,ss1.options[i].value);
v[k] = i;
k++;
}
}
for(i=v.length-1;i>=0;i--)
ss1.options[v[i]] = null;
}
</script>
<!-- Hiding
function AllToRight() { for (i=0;i<mae.length;i++){
var oAdd = document.createElement("OPTION");
oAdd.text = mae.options[i].text;
oAdd.value = mae.options[i].value;
ado.add(oAdd);
} for (i=mae.length;i>-1;i--){
mae.remove(i);
}} function AllToLeft() { for (i=0;i<ado.length;i++){
var oAdd = document.createElement("OPTION");
oAdd.text = ado.options[i].text;
oAdd.value = ado.options[i].value;
mae.add(oAdd);
} for (i=ado.length;i>-1;i--){
ado.remove(i);
} } function ToRight() { for (i=0;i<mae.length;i++){
if (mae.options[i].selected){
var oAdd = document.createElement("OPTION");
oAdd.text = mae.options[i].text;
oAdd.value = mae.options[i].value;
ado.add(oAdd);
}
} for (i=mae.length-1;i>-1;i--){
if (mae.options[i].selected){
mae.remove(i);
}
} } function ToLeft() { for (i=0;i<ado.length;i++){
if (ado.options[i].selected){
var oAdd = document.createElement("OPTION");
oAdd.text = ado.options[i].text;
oAdd.value = ado.options[i].value;
mae.add(oAdd);
}
} for (i=ado.length-1;i>-1;i--){
if (ado.options[i].selected){
ado.remove(i);
}
} }
// -->
</script>
<html>
<body>
<table align="center">
<tr>
<td>
<select name="mae" size="20" style="width:120" MULTIPLE>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
</select>
</td>
<td>
<table>
<tr><INPUT type="button" value=" >> " onclick=AllToRight()></tr><br>
<tr><INPUT type="button" value=" > " onclick=ToRight()></tr><br>
<tr><INPUT type="button" value=" << " onclick=AllToLeft()></tr><br>
<tr><INPUT type="button" value=" < " onclick=ToLeft()></tr><br>
</table>
</td>
<td>
<select name="ado" size="20" style="width:120" MULTIPLE>
</select>
</td>
</tr>
</table>
</body>
</html>