select.htm
说明:
本程式支持shift和ctrl功能!(即:连选和跳选多项option)
可以任意的相互操作(下拉列表框1<=>下拉列表框2)!
<html>
<head>
<meta content="text/html; charset=gb2312" http-equiv=content-type>
<link rel="stylesheet" href="common.css">
</head>
<body bgcolor=skyblue>
<form action="select.htm" method="post" name="myform">
<br><br><br>
<div align="center"><center><left>
<table style="font-size: smaller">
<tr><td>
<table>
<tr><td>
<select name="left_select" style="height: 200px; width: 100px" multiple>
<option value="a">a</option><option value="b">b</option>
<option value="c">c</option><option value="d">d</option>
<option value="e">e</option><option value="f">f</option>
<option value="g">g</option><option value="h">h</option>
<option value="i">i</option><option value="j">j</option>
<option value="k">k</option><option value="l">l</option>
<option value="m">m</option><option value="n">n</option>
<option value="o">o</option><option value="p">p</option>
</select>
</td></tr>
</table>
</td><td>
<table border="0">
<br><br>
<tr><td>
<input language="javascript" name="btn_select_addany" onclick="fun_select_addany(document.myform)" style="color: blue; font-family: webdings; font-size: 12pt; font-weight: normal; height: 28px; width: 27px" title="add any" type=button value="8"></td></tr><tr><td>
<input language="javascript" name="btn_select_addall" onclick="fun_select_addall(document.myform)" style="color: blue; font-family: webdings; font-size: 12pt; font-weight: normal; height: 28px; width: 27px" title="add all" type=button value=: designtimesp="17713"></td></tr><tr><td>
<br><br></td></tr><tr><td>
<input language="javascript" name="btn_select_dltany" onclick="fun_select_dltany(document.myform)" style="color: blue; font-family: webdings; font-size: 12pt; font-weight: normal; height: 28px; width: 27px" title ="delete any" type=button value="7"></td></tr><tr><td>
<input language="javascript" name="btn_select_dltall" onclick="fun_select_dltall(document.myform)" style="color: blue; font-family: webdings; font-size: 12pt; font-weight: normal; height: 28px; width: 27px" title ="delete all" type=button value="9"></td></tr>
<tr><td></td></tr>
<tr><td>
</td></tr>
</table></td><td>
<table style="font-size: smaller">
<tr><td>
<select name="right_select" style="height: 200px; width: 100px" multiple>
</select>
</td></tr>
</table>
</td></tr></tbody></table></div></center>
</form>
</body>
</html>
<script language="javascript">
function fun_select_addany(theform){
var i;
for (i=0;i<theform.left_select.length;i++){
if (theform.left_select.options[i].selected == true){
if (theform.left_select.options[i].text !=""){
theform.right_select.options[theform.right_select.length]=new option(theform.left_select.options[i].text);
theform.left_select.options[i] =new option("");
}
}
}
for (i=0;i<theform.left_select.length;i++){
if (theform.left_select.options[i].text ==""){theform.left_select.options.remove(i); i–;}
}
}
function fun_select_addall(theform){
var i;
for (i=0;i<theform.left_select.length;i++){
if (theform.left_select.options[i].text !=""){
theform.right_select.options[theform.right_select.length]=new option(theform.left_select.options[i].text);
}
}
theform.left_select.length=0;
}
function fun_select_dltany(theform){
var i;
for (i=0;i<theform.right_select.length;i++){
if (theform.right_select.options[i].selected == true){
if (theform.right_select.options[i].text !=""){
theform.left_select.options[theform.left_select.length]=new option(theform.right_select.options[i].text);
theform.right_select.options[i] =new option("");
}
}
}
for (i=0;i<theform.right_select.length;i++){
if (theform.right_select.options[i].text ==""){theform.right_select.options.remove(i);i–;}
}
}
function fun_select_dltall(theform){
var i;
for (i=0;i<theform.right_select.length;i++){
if (theform.right_select.options[i].text !=""){
theform.left_select.options[theform.left_select.length]=new option(theform.right_select.options[i].text);
}
}
theform.right_select.length=0;
}
</script>
