脚本说明:
把如下代码加入<body>区域中
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
oldvalue = "";
function passText(passedvalue) {
if (passedvalue != "") {
var totalvalue = passedvalue+"\n"+oldvalue;
document.displayform.itemsbox.value = totalvalue;
oldvalue = document.displayform.itemsbox.value;
}
}
// End -->
</script>
<form name="selectform">
<select name="dropdownbox" size=1>
<option value="">请选择</option>
<option value="第一项">第一项</option>
<option value="第二项">第二项</option>
<option value="第三项">第三项</option>
<option value="第四项">第四项</option>
<option value="第五项">第五项</option>
<option value="第六项">第六项</option>
</select>
<input type=button value="添加到列表中" onClick="passText(this.form.dropdownbox.options[this.form.dropdownbox.selectedIndex].value);">
</form>
<form name="displayform" >
<font face="Arial, Helvetica, Sans Serif" size="3"><b>你可以自己选择一下:</b></font><br>
<textarea cols="30" rows="5" name="itemsbox" >
PHP代码:--------------------------------------------------------------------------------
脚本说明:
把如下代码加入<body>区域中
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
var delimiter = ":";
function MoveOption (MoveFrom, MoveTo, ToDo) {
var SelectFrom = eval(@#document.main_form.@#+MoveFrom);
var SelectTo = eval(@#document.main_form.@#+MoveTo);
var SelectedIndex = SelectFrom.options.selectedIndex;
var container;
if (ToDo==@#Add@#) {
container=eval(@#document.main_form.@#+ToDo+MoveTo);
}
if (ToDo==@#Remove@#) {
container=eval(@#document.main_form.@#+ToDo+MoveFrom);
}
if (SelectedIndex == -1) {
alert("请选择一个用户");
} else {
for (i=0; i<SelectFrom.options.length; i++) {
if(SelectFrom.options[i].selected) {
var name = SelectFrom.options[i].text;
var ID = SelectFrom.options[i].value;
SelectFrom.options[i] = null;
SelectTo.options[SelectTo.options.length]=new Option (name,ID);
i=i-1;
if(ToDo==@#Add@#||ToDo==@#Remove@#) {
container.value=container.value+name+delimiter;
//container.value=container.value+ID+delimiter;
}
}
}
}
}
function CheckDuplicates (AddListContainer, RemoveListContainer) {
var AddList = eval(@#document.main_form.@#+AddListContainer);
var RemoveList = eval(@#document.main_form.@#+RemoveListContainer);
var TempAddList = AddList.value;
var TempRemoveList = RemoveList.value;
if (TempAddList>@#@#&&TempRemoveList>@#@#) {
TempAddList = TempAddList.substring(0,TempAddList.length-1);
TempRemoveList = TempRemoveList.substring(0,TempRemoveList.length-1);
var AddArray = TempAddList.split(delimiter);
var RemoveArray = TempRemoveList.split(delimiter);
for (i=0; i<AddArray.length; i++) {
for (j=0; j<RemoveArray.length; j++) {
if (AddArray[i]==RemoveArray[j]) {
AddArray[i]=@#@#;
RemoveArray[j]=@#@#;
break;
}
}
}
AddList.value=@#@#;
for (i=0; i<AddArray.length; i++) {
if (AddArray[i]>@#@#) {
AddList.value = AddList.value + AddArray[i] + delimiter;
}
}
RemoveList.value=@#@#;
for (i=0; i<RemoveArray.length; i++) {
if (RemoveArray[i]>@#@#) {
RemoveList.value = RemoveList.value + RemoveArray[i] + delimiter;
}
}
}
}
function LockChanges() {
CheckDuplicates(@#AddAdmins@#,@#RemoveAdmins@#);
CheckDuplicates(@#AddUsers@#,@#RemoveUsers@#);
}
// End -->
</script>
<table align="center">
<tr><td>
<FORM name=main_form action="" method=post><INPUT type=hidden name=AddAdmins>
<INPUT type=hidden name=RemoveAdmins> <INPUT type=hidden name=AddUsers> <INPUT
type=hidden name=RemoveUsers>
<div align="center">
<table cellspacing="0" cellpadding="5" border="0">
<tbody>
<tr>
<td valign="top" align="middle" rowspan="2">备选用户<br><select multiple size="12" name="Employees">
<option>Employee_01<option>Employee_02<option>Employee_03<option>Employee_04<option>Employee_05<option>Employee_06<option>Employee_07<option>Employee_08<option>Employee_09<option>Employee_10</option></select>
</td>
<td>
<p align="center"><input onclick="MoveOption(@#Employees@#,@#Admins@#,@#Add@#);" type="button" value="增加Admin >>" name=add_admin>
</p>
<p align="center"><input onclick="MoveOption(@#Admins@#,@#Employees@#,@#Remove@#);" type="button" value="<< 删除Admin" name="remove_admin">
</p></td>
<td valign="top" align="middle">Administrators<br><select multiple size="5" name="Admins">
<option>Admin_01<option>Admin_02<option>Admin_03<option>Admin_04<option>Admin_05</option></select>
</td></tr>
<tr>
<td>
<p align="center"><input onclick="MoveOption(@#Employees@#,@#Users@#,@#Add@#);" type="button" value="增加User >> " name=add_user>
</p>
<p align="center"><input onclick="MoveOption(@#Users@#,@#Employees@#,@#Remove@#);" type="button" value=" << 删除User " name="remove_user">
</p></td>
<td valign="top" align="middle">Users<br><select multiple size="5" name="Users">
<option>User_01<option>User_02<option>User_03<option>User_04<option>User_05</option></select>
</td></tr>
</tbody>
</table>
</div>
</FORM>
</td></tr>
<tr><td>
<div align="center"><input onclick="LockChanges();" type="button" value="保存修改"></div>
<BR>
<div align="center">
<a href="java script:alert(document.main_form.AddAdmins.value);">查询增加的Admin</a>
<br>
<a href="java script:alert(document.main_form.RemoveAdmins.value);">查询删除的Admin</a>
<br>
<a href="java script:alert(document.main_form.AddUsers.value);">查询增加的User</a>
<br>
<a href="java script:alert(document.main_form.RemoveUsers.value);">查询删除的User</a>
</div>
</td></tr>
</td></tr>
</table>
PHP代码:--------------------------------------------------------------------------------
脚本说明：
把如下代码加入<body>区域中:
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
sortitems = 1; // Automatically sort items within lists? (1 or 0)
function move(fbox,tbox) {
for(var i=0; i<fbox.options.length; i++) {
if(fbox.options[i].selected && fbox.options[i].value != "") {
var no = new Option();
no.value = fbox.options[i].value;
no.text = fbox.options[i].text;
tbox.options[tbox.options.length] = no;
fbox.options[i].value = "";
fbox.options[i].text = "";
}
}
BumpUp(fbox);
if (sortitems) SortD(tbox);
}
function BumpUp(box) {
for(var i=0; i<box.options.length; i++) {
if(box.options[i].value == "") {
for(var j=i; j<box.options.length-1; j++) {
box.options[j].value = box.options[j+1].value;
box.options[j].text = box.options[j+1].text;
}
var ln = i;
break;
}
}
if(ln < box.options.length) {
box.options.length -= 1;
BumpUp(box);
}
}
function SortD(box) {
var temp_opts = new Array();
var temp = new Object();
for(var i=0; i<box.options.length; i++) {
temp_opts[i] = box.options[i];
}
for(var x=0; x<temp_opts.length-1; x++) {
for(var y=(x+1); y<temp_opts.length; y++) {
if(temp_opts[x].text > temp_opts[y].text) {
temp = temp_opts[x].text;
temp_opts[x].text = temp_opts[y].text;
temp_opts[y].text = temp;
temp = temp_opts[x].value;
temp_opts[x].value = temp_opts[y].value;
temp_opts[y].value = temp;
}
}
}
for(var i=0; i<box.options.length; i++) {
box.options[i].value = temp_opts[i].value;
box.options[i].text = temp_opts[i].text;
}
}
// End -->
</script>
<form ACTION="" METHOD="POST">
<table border="0">
<tr>
<td><select multiple size="5" name="list1">
<option value="11"> item 1.1 </option>
<option value="12"> item 1.2 </option>
<option value="13"> item 1.3 </option>
</select></td>
<td>
<input type="button" value=" >> " onclick="move(this.form.list1,this.form.list2)" name="B1"><br>
<input type="button" value=" << " onclick="move(this.form.list2,this.form.list1)" name="B2">
</td>
<td><select multiple size="5" name="list2">
<option value="21"> item 2.1 </option>
<option value="22"> item 2.2 </option>
<option value="23"> item 2.3 </option>
</select></td>
</tr>
</table>
</form>
延伸阅读
文章来源于领测软件测试网 https://www.ltesting.net/
