目的：
實現一個從左邊的列表框中選擇一項，點擊添加，該項進入到右邊的列表框中，從右邊的列表框中選擇一項，點擊刪除則該項從右邊的列表框中刪除，類似與51job里的那個功能。
代碼：?1?<html>
?2?<head>
?3?<meta?http-equiv="Content-Type"?content="text/html;?charset=gb2312">
?4?<script?language="javascript">
?5?function?Add(ObjSource,ObjTarget){
?6?for(var?i=0;i<ObjSource.length;i++){
?7?if(ObjSource.options[i].selected){
?8?var?opt=document.createElement("OPTION");
?9?opt.value=ObjSource.options[i].value;
10?opt.text=ObjSource.options[i].text;
11?ObjTarget.add(opt);
12?ObjSource.options.removeChild(ObjSource.options[i--]);
13?}
14?}
15?}
16?
17?function?AddAll(ObjSource,ObjTarget){
18?SelectAll(ObjSource);
19?Add(ObjSource,ObjTarget);
20?}
21?
22?function?SelectAll(ObjSource){
23?for(var?i=0;i<ObjSource.length;i++){
24?ObjSource.options[i].selected?=?true;
25?}
26?}
27?
28?function?fClose(){
29?var?obj1?=?document.getElementsByName('Target')[0];
30?returnStr?=?'';
31?for?(var?i=0;i<obj1.length;i++)
32?{
33?returnStr?+=?obj1.options[i].text?+?','?+?obj1.options[i].value?+?';';
34?}
35?window.returnValue?=?returnStr;
36?window.close();
37?}
38?</script>
39?</head>
40?<body>
41?<table?width="350"?height="50"?border="1"?style="border-collapse:collapse"?bordercolor="#111111"?cellpadding="0"?cellspacing="0">
42?<tr>
43?<td?width="150">
44?<html:select?name="Source"?multiple="true"?size="10"?style="width:250px"?ondblclick="Add(document.all.Source,document.all.Target)"><html:options?labelProperty="Depot_Province/entity/ORGNAME"?property="Depot_Province/entity/ORGCODE"/></html:select>
45?</td>
46?<td?width="50"?valign="middle">
47?<p?style="width:100%"?align="center">
48?<input?type="button"?value="->"?onClick="Add(document.all.Source,document.all.Target)"?title="添加">
49?</p>
50?<p?style="width:100%"?align="center">
51?<input?type="button"?value=">>"?onClick="AddAll(document.all.Source,document.all.Target)"?title="添加全部">
52?</p>
53?<p?style="width:100%"?align="center">
54?<input?type="button"?value="<-"?onClick="Add(document.all.Target,document.all.Source)"?title="刪除">
55?</p>
56?<p?style="width:100%"?align="center">
57?<input?type="button"?value="<<"?onClick="AddAll(document.all.Target,document.all.Source)"?title="刪除全部">
58?</p>
59?</td>
60?<td?width="150">
61?<select?name="Target"?multiple="multiple"?size="10"?style="width:250px"?ondblclick="Add(document.all.Target,?document.all.Source)"></select>
62?</td>
63?</tr>
64?<tr>
65?<td?align="right"?colspan="3"><input?type=button?onclick="fClose()"?value="確定"></td>
66?</tr>
67?</table>
68?</body>
69?</html>
posted on 2006-06-15 09:34
千山鳥飛絕 閱讀(1595)
評論(2) 編輯 收藏 所屬分類:
JavaScript