使用ASP与JAVASCRIPT配合实现多个复选框数据关联显示

作者:平凡点滴【一凡】

  1<html>
  2<head>
  3<meta content="DANNY KANG" name="AUTHOUR"/>
  4<meta content="2004-10-28" name="CreateDate"/>
  5<meta content="DANNY KANG,DannyKang,DK,[D.K],pizz" name="Keywords"/>
  6<meta content="text/html; charset=utf-8" http-equiv="content-type"/>
  7<script language="javascript">   
  8//'+--------------------------------------------   
  9//'+ FileName:   
 10//'+ Created : 2004-10-28 .by pizz [D.K]   
 11//'+ Modified: 2004-10-28 .by pizz [D.K]   
 12//'+ FuncDesc: 使用ASP与JAVASCRIPT配合实现多个复选框数据关联显示   
 13//'+ www.knowsky.com   
 14//'+--------------------------------------------- 
 15
 16//第一个复选框的内容   
 17var DK_Array1 = new Array();   
 18/*以下部分,可以使用ASP动态生成*/   
 19DK_Array1[DK_Array1.length]=new Array('1','分类1'); //分类ID,分类名称   
 20DK_Array1[DK_Array1.length]=new Array('2','分类2');   
 21DK_Array1[DK_Array1.length]=new Array('3','分类3');   
 22DK_Array1[DK_Array1.length]=new Array('4','分类4');   
 23DK_Array1[DK_Array1.length]=new Array('5','分类5');   
 24DK_Array1[DK_Array1.length]=new Array('6','分类6');   
 25DK_Array1[DK_Array1.length]=new Array('7','分类7');   
 26DK_Array1[DK_Array1.length]=new Array('8','分类8');   
 27/////////////////////////////////////////////////////// 
 28
 29//第三个复选框的内容   
 30var DK_Array3 = new Array();   
 31/*以下部分,可以使用ASP动态生成*/   
 32DK_Array3[DK_Array3.length]=new Array('1','1','小类1.1'); //分类ID,小类ID,小类名称   
 33DK_Array3[DK_Array3.length]=new Array('1','2','小类1.2');   
 34DK_Array3[DK_Array3.length]=new Array('1','3','小类1.3');   
 35DK_Array3[DK_Array3.length]=new Array('2','4','小类2.4');   
 36DK_Array3[DK_Array3.length]=new Array('2','5','小类2.5');   
 37DK_Array3[DK_Array3.length]=new Array('2','6','小类2.6');   
 38DK_Array3[DK_Array3.length]=new Array('2','7','小类2.7');   
 39DK_Array3[DK_Array3.length]=new Array('3','8','小类3.8');   
 40DK_Array3[DK_Array3.length]=new Array('4','9','小类4.9');   
 41DK_Array3[DK_Array3.length]=new Array('4','10','小类4.10');   
 42DK_Array3[DK_Array3.length]=new Array('4','11','小类4.11');   
 43DK_Array3[DK_Array3.length]=new Array('4','12','小类4.12');   
 44DK_Array3[DK_Array3.length]=new Array('5','13','小类5.13');   
 45DK_Array3[DK_Array3.length]=new Array('5','14','小类5.14');   
 46DK_Array3[DK_Array3.length]=new Array('6','15','小类6.15');   
 47DK_Array3[DK_Array3.length]=new Array('6','16','小类6.16');   
 48DK_Array3[DK_Array3.length]=new Array('6','17','小类6.17');   
 49DK_Array3[DK_Array3.length]=new Array('6','18','小类6.18');   
 50DK_Array3[DK_Array3.length]=new Array('6','19','小类6.19');   
 51DK_Array3[DK_Array3.length]=new Array('7','20','小类7.20');   
 52DK_Array3[DK_Array3.length]=new Array('8','21','小类8.21');   
 53DK_Array3[DK_Array3.length]=new Array('8','22','小类8.22');   
 54/////////////////////////////////////////////////////// 
 55
 56  
 57function DK_AddOnTo(obj,val,txt){ //增加一项   
 58if(DK_CheckExists(obj,val,txt)) {   
 59alert('选项已存在:['+obj.id+']'+'\n Value: '+ val+'\n Text: '+txt);   
 60return;   
 61}   
 62var opt=new Option();   
 63opt.value=val;   
 64opt.text=txt;   
 65obj.options.add(opt,0);   
 66} 
 67
 68function DK_InitListObject(obj,array){//初始化列表   
 69if(array.length){   
 70for(var i=0;i<array.length;i++){   
 71DK_AddOnTo(obj,array[i][0],array[i][1]);   
 72}   
 73}   
 74else {   
 75alert('无数据');   
 76}   
 77} 
 78
 79function DK_AddTo(src,obj){//往指定列表添加选项   
 80  
 81for(var i=0;i<src.length;i++){   
 82if(src.options[i].selected){   
 83DK_AddOnTo(obj,src.options[i].value,src.options[i].text);   
 84}   
 85}   
 86} 
 87
 88function DK_SelectAll(obj){ //选中全部选项   
 89for(var i=0;i<obj.length;i++){   
 90obj.options[i].selected = true;   
 91}   
 92}   
 93function DK_ClearAll(obj){//删除全部选项   
 94if(obj.length-1>=0){   
 95for(var i=obj.length-1;i>=0;i--){   
 96obj.remove(i);   
 97}   
 98}   
 99}   
100function DK_RemoveOne(obj){//删除选定项   
101for(var i=obj.length-1;i>=0;i--){   
102if(obj.options[i].selected){   
103obj.remove(i);   
104}   
105}   
106} 
107
108function DK_CheckExists(obj,val,txt){//检查项是否已存在   
109if(obj.length<0) return false;   
110for(var i=0;i<obj.length;i++){   
111if(obj.options[i].value==val && obj.options[i].text==txt) {   
112return true;   
113}   
114}   
115return false;   
116} 
117
118function DK_ListTo(src,obj,array){//显示子类   
119if(array.length){   
120var j=0;   
121for(var i=0;i<src.length;i++){   
122if(src.options[i].selected){   
123j+=DK_AddSpecList(src.options[i].value,array,obj);   
124}   
125}   
126alert('共发现'+j+'个小类。');   
127}   
128else {   
129alert('无数据');   
130}   
131} 
132
133function DK_AddSpecList(classid,array,obj){//搜索子类   
134var j=0;   
135for(var i=0;i<array.length;i++){   
136if(array[i][0]==classid){   
137DK_AddOnTo(obj,array[i][1],array[i][2]);   
138j++;   
139}   
140}   
141return j;   
142} 
143
144</script>
145<style type="text/css"></style>
146<title></title>
147</head>
148<body>
149<table>
150<tr><td colspan="4"><input onclick="DK_InitListObject(select1,DK_Array1)" type="button" value="初始化复选框一"/><br/><br/>
151<tr><td>复选框一:<td><select id="select1" multiple="" size="8"></select>
152<td><input onclick="DK_AddTo(select1,select2)" type="button" value="添加"/> ==&gt;   
153<td>复选框二:<br/>&lt;== <input onclick="DK_RemoveOne(select2)" type="button" value="删除"/>
154<input onclick="DK_ClearAll(select2)" type="button" value="全删"/>
155<td><select id="select2" multiple="" size="8"></select>
156<td><input onclick="DK_ListTo(select2,select3,DK_Array3)" type="button" value="列出相关"/> ==&gt;   
157<td>复选框三:<br/>&lt;== <input onclick="DK_RemoveOne(select3)" type="button" value="删除"/>
158<input onclick="DK_ClearAll(select3)" type="button" value="全删"/>
159<td><select id="select3" multiple="" size="8"></select><br/>
160</td></td></td></td></td></td></td></td></tr></td></tr></table>
161</body>
162</html>
Published At
Categories with Web编程
Tagged with
comments powered by Disqus