The method of realizing multi-level linkage Pull-down menu with JavaScript _javascript skill

This paper illustrates the method of implementing multi-level linkage Pull-down menu with JavaScript. Share to everyone for your reference. The implementation methods are as follows:

Copy Code code as follows:

<script language= "JavaScript" >
<!--Begin
var arrItems1 = new Array ();
var arrItemsGrp1 = new Array ();
ARRITEMS1[3] = "column Two";
ARRITEMSGRP1[3] = 1;
ARRITEMS1[4] = "column two or three";
ARRITEMSGRP1[4] = 1;
ARRITEMS1[5] = "column 24";
ARRITEMSGRP1[5] = 1;
ARRITEMS1[6] = "column three";
ARRITEMSGRP1[6] = 2;
ARRITEMS1[7] = "column 31";
ARRITEMSGRP1[7] = 2;
ARRITEMS1[0] = "Column IV";
Arritemsgrp1[0] = 3;
ARRITEMS1[1] = "column 41";
ARRITEMSGRP1[1] = 3;
ARRITEMS1[2] = "column 42";
ARRITEMSGRP1[2] = 3;
var arrItems2 = new Array ();
var arrItemsGrp2 = new Array ();
ARRITEMS2[21] = "column 4-0";
ARRITEMSGRP2[21] = 0
ARRITEMS2[22] = "column 4-1";
ARRITEMSGRP2[22] = 0
ARRITEMS2[31] = "column 41-0";
ARRITEMSGRP2[31] = 1
ARRITEMS2[34] = "column 41-1";
ARRITEMSGRP2[34] = 1
ARRITEMS2[35] = "column 42-0";
ARRITEMSGRP2[35] = 2
ARRITEMS2[99] = "column 24-2";
ARRITEMSGRP2[99] = 5
ARRITEMS2[100] = "column 24-1";
ARRITEMSGRP2[100] = 5
ARRITEMS2[57] = "column 24-0";
ARRITEMSGRP2[57] = 5
ARRITEMS2[101] = "column 2-0";
ARRITEMSGRP2[101] = 3
ARRITEMS2[102] = "column 2-1";
ARRITEMSGRP2[102] = 3
ARRITEMS2[103] = "column 23-0";
ARRITEMSGRP2[103] = 4
ARRITEMS2[104] = "column 23-1";
ARRITEMSGRP2[104] = 4
ARRITEMS2[105] = "column 3-0";
ARRITEMSGRP2[105] = 6
ARRITEMS2[106] = "column 3-1";
ARRITEMSGRP2[106] = 6
ARRITEMS2[200] = "column 31-0";
ARRITEMSGRP2[200] = 7
ARRITEMS2[201] = "column 31-1";
ARRITEMSGRP2[201] = 7
ARRITEMS2[203] = "column 31-2";
ARRITEMSGRP2[203] = 7
function Selectchange (Control, Controltopopulate, ItemArray, Grouparray)
{
var Myele;
var x;
Empty The second drop down box of any choices
for (var q=controltopopulate.options.length;q>=0;q--) Controltopopulate.options[q]=null;
if (Control.name = = "FirstChoice") {
Empty The third drop down box of any choices
for (Var q=mychoices.thirdchoice.options.length;q>=0;q--) mychoices.thirdchoice.options[q] = null;
}
ADD Default choice-in Case there are no values
Myele = document.createelement_x ("option");
Myele.value = 0;
Myele.text = "[List]";
Controltopopulate.add (Myele);
for (x = 0; x < Itemarray.length + +)
{
if (grouparray[x] = = Control.value)
{
Myele = document.createelement_x ("option");
Myele.value = x;
Myele.text = Itemarray[x];
Controltopopulate.add (Myele);
}
}
}
End-->
</script>
<form name=mychoices>
<table align= "center" >
<tr>
<td>
<select id=firstchoice name=firstchoice onchange= "Selectchange (this, Mychoices.secondchoice, ARRITEMS1, ARRITEMSGRP1); " >
<option value= "0" > List one </option>
<option value= "1" > List two </option>
<option value= "2" > List three </option>
<option value= "3" > list four </option>
</SELECT>
</TD><TD>
<select id=secondchoice name=secondchoice onchange= "Selectchange (this, Mychoices.thirdchoice, ARRITEMS2, ARRITEMSGRP2); " >
</SELECT>
<select Id=thirdchoice name=thirdchoice>
</SELECT>
</TD>
</TR>
</TABLE>
</form>

The

wants this article to help you with your JavaScript programming.