1 <!doctype html>
2 <html>
3 <head>
4 <meta charset="utf-8">
5 <title>无标题文档</title>
6
7 <script>
8 //自定义框架
9 (function(){
10 //命名空间的定义
11 if(!window[‘cwy‘]){
12 window[‘cwy‘]={};
13 }
14 function $(id){
15 return document.getElementById(id);
16 }
17 window[‘cwy‘][‘$‘]=$;
18
19 //清除元素
20 function ClearElement(e){
21 if(e.length<=0)
22 return;
23 var length=e.length;
24 for(var idx=length;idx>0;idx--)
25 e.options[idx-1]=null;
26 //length=e.length;
27 }
28 window[‘cwy‘][‘ClearElement‘]=ClearElement;
29
30 //更新元素
31 function UpdateElement(e,e_array){
32 var length=e.length;
33 if(length!=0){
34 ClearElement(e);
35 }
36 for(var idx=0;idx<e_array.length;idx++)
37 e.options[idx]=new Option(e_array[idx]);
38 //length=e.length;
39 }
40 window[‘cwy‘][‘UpdateElement‘]=UpdateElement;
41 })();
42
43 window.onload=function(){
44
45 var n1=[‘语文‘,‘数学‘,‘英语‘,‘政治‘,‘历史‘,‘地理‘];
46 var n2=[‘语文‘,‘数学‘,‘英语‘,‘物理‘,‘化学‘,‘生物‘];
47 var subject=cwy.$(‘subject‘);
48 subject.onchange=function(){
49 switch(subject.value){
50 case ‘wen‘:cwy.UpdateElement(cwy.$(‘book‘),n1);break;
51 case ‘li‘:cwy.UpdateElement(cwy.$(‘book‘),n2);break;
52 default:cwy.CleaeElement(cwy.$(‘book‘));break;
53 }
54 /*if(subject.value==‘wen‘)
55 cwy.UpdateElement(cwy.$(‘book‘),n1);
56 else if(subject.value==‘li‘)
57 cwy.UpdateElement(cwy.$(‘book‘),n2);
58 else
59 cwy.ClearElement(cwy.$(‘book‘));*/
60 }
61 }
62
63 </script>
64
65 </head>
66
67 <body>
68 <select id="subject">
69 <option value="">--请选择科目--</option>
70 <option value="wen">文科</option>
71 <option value="li">理科</option>
72 </select>
73 <select id="book">
74 </select>
75 </body>
76 </html>
二级菜单联动(自定义框架)
时间： 2024-10-11 13:48:01