实习日志----2.两个select联动

****两种广告屏“南海屏”、“川籍屏”，分别对应不同的显示方式

首先拉2个select控件

代码如下：

1        <tr>
2          <td> &nbsp;产品类型：<select name="Stype" id="Stype" onchange="getSway()" style="width:150px">
3              </select></td>
4        </tr>
5        <tr>
6          <td>&nbsp;显示方式：<select name="Sway" id="Sway" style="width:150px">
7          </select></td>
8        </tr>

 

这里用到了onchange事件，每种显示方式对应一个值以便于在后台存入数据库。

下面是JavaScript代码:

 

 1<script language="javascript"> 
 2var Lx = new Array("南海屏","川基屏");
 3var Fs = new Array();
 4Fs["南海屏"]=new Array("静止","流水","左开","右开","中开","中合","上开","下开","闪烁","上移","下移");
 5FSValue["南海屏"] = new Array("1","2","3","4","5","6","7","8","9","10","11");
 6Fs["川基屏"]=new Array("随机","保持","走马灯","卷轴","左移","右移","上移","下移","移出","移入","左擦","右擦","上擦","下擦","擦入","擦出","中擦","互锁","吐丝","吐丝","百叶窗","飘雪","星光","切换","渐显","闪动","闪耀");
 7FSValue["川基屏"] = new Array("0","1","2","3","4","5","6","7","8","9","10","11","12","13","14","15","16","17","18","19","20","21","22","23","24","25","26");
 8function getSway()
 9{
10    var Sway=document.getElementById("Sway");   
11    var value1=document.getElementById("Stype").value; 
12    Sway.options.length=0;  
13    for(var it in Fs[value1]){   
14    Sway.options.add(new Option(Fs[value1][it],FSValue[value1][it]));   
15    } 
16}
17function init()
18{    
19    var Stype=document.getElementById("Stype"); 
20    var Sway=document.getElementById("Sway");   
21    for(var i=0;i <Lx.length;i++){    
22    Stype.options.add(new Option(Lx[i],Lx[i])); } 
23    getSway(); 
24} 
25window.onload=init;
26</script>
27