Drop-down box cascade operation (JS)

2019 Unicorn Enterprises heavily recruiting engineers Python standard >>>

<xmdc:outputText value="国民经济部门"></xmdc:outputText>
			<xmdc:panelGroup>
				<xmdc:verbatim>
					<select id="select1" onchange="getEcoDepartName();">
						<option value="">请选择</option>
						<option value="A">政府部门</option>
						<option value="B">金融机构部门</option>
						<option value="C">非金融企业部门</option>
						<option value="D">住户部门</option>
						<option value="E">非居民部门</option>
					</select>
					<select id="select2">
						<option value="">请选择</option>
					</select>
				</xmdc:verbatim>
				<xmdc:outputText value="*" style="color:red"></xmdc:outputText>
			</xmdc:panelGroup>

			<xmdc:outputText value="企业出资人经济成分"></xmdc:outputText>
			<xmdc:panelGroup>
				<xmdc:verbatim>
					<select id="select3" onchange="getEcoElement();">
						<option value="">请选择</option>
						<option value="A">公有控股经济</option>
						<option value="B">非公有控股经济</option>
					</select>  
					<select id="select4" onchange="getEcoElement1();">
						<option value="">请选择</option>
					</select>  
					<select id="select5" onchange="">
						<option value="">请选择</option>
					</select>
				</xmdc:verbatim>
				<xmdc:outputText value="*" style="color:red"></xmdc:outputText>
			</xmdc:panelGroup> 

 

Add in page load js trigger event:

window.attachEvent("onload",onInit);

 

function onInit(){
				firstFlag = true;
				getEcoDepartName();
				getEcoElement();
				getEcoElement1();
				//alert("aaa");
				firstFlag = false;
			}

 

 

var ecoDepartName=[
     ["中央政府","地方政府","社会保障基金"],
      ["货币当局","监管当局","银行业存款类金融机构","银行业非存款类金融机构","证券业金融机构","保险业金融机构","交易及结算类金融机构","金融控股公司","特定目的载体","其他"],
      ["公司","非公司企业","其他非金融企业部门"],
  ["住户","为住户服务的非营利机构"],
  ["国际组织","外国政府","国外金融机构","国外非金融企业","外国居民"]
    ];
    
    var ecoDepartCd = [
     ["A01","A02","A03"],
      ["B01","B02","B03","B04","B05","B06","B07","B08","B09","B99"],
      ["C01","C02","C99",],
  ["D01","D02"],
  ["E01","E02","E03","E04","E05"]
    ];
    
    function getEcoDepartName(){
  var select1 = ccrm.util.get("select1");
  var select2 = ccrm.util.get("select2");
  var arrDepart = ecoDepartName[select1.selectedIndex-1];
  var arrDepartCd = ecoDepartCd[select1.selectedIndex-1];
  select2.length=1;
  for(var i=0;i< arrDepart.length;i++){
   select2[i+1] = new Option(arrDepart[i],arrDepartCd[i]);
  }
 }
    //A 公有控股经济 B 非公有控股经济
    var ecoElement = [["国有控股","集体控股"],
         ["私人控股","港澳台控股","外商控股"]];
    var ecoElementCd = [["A01","A02"],["B01","B02","B03"]];
    
    var ecoElement1 = [["国有相对控股","国有绝对控股"],
         ["集体相对控股","集体绝对控股"],
         ["私人相对控股","私人绝对控股"],
         ["港澳台相对控股","港澳台绝对控股"],
         ["外商相对控股","外商绝对控股"]];
    
 var ecoElementCd1 = [["A0101","A0102"],
      ["A0201","A0202"],
      ["B0101","B0102"],
      ["B0201","B0202"],
      ["B0301","B0302"]];
 function getEcoElement(){
  var select3 = ccrm.util.get("select3");
  var select4 = ccrm.util.get("select4");
  var select5 = ccrm.util.get("select5");
  var arrElement = ecoElement[select3.selectedIndex-1];
  var arrElementCd = ecoElementCd[select3.selectedIndex-1];
  select4.length=1;
  select5.length=1;
  for(var i=0;i<arrElement.length;i++){
   select4[i+1] = new Option(arrElement[i],arrElementCd[i]);
  }
 }
 function getEcoElement1(){
  var select3 = ccrm.util.get("select3");
  var select4 = ccrm.util.get("select4");
  var select5 = ccrm.util.get("select5");
  var len = select3.selectedIndex-1;
  var tmpLen = 0;
  for(var i =0 ;i<len;i++){
   tmpLen+=ecoElement[i].length;
  }
  tmpLen+=select4.selectedIndex-1;
  var arrecoElement1 = ecoElement1[tmpLen];
  var arrecoElementCd1 = ecoElementCd1[tmpLen];
  select5.length=1;
  for(var i=0;i<arrecoElement1.length;i++){
   select5[i+1] = new Option(arrecoElement1[i],arrecoElementCd1[i]);
  }
 }

Reproduced in: https: //my.oschina.net/u/2552902/blog/543967