Methode zur Implementierung des Dropdown-Menüs mehrstufiger Verknüpfung in mehreren Ebenen in JavaScript

Dieser Artikel beschreibt die Methode zur Implementierung von Dropdown-Menüs mit mehreren Ebenen in JavaScript. Teilen Sie es für Ihre Referenz. Die spezifische Implementierungsmethode lautet wie folgt:

Die Codekopie lautet wie folgt:

<Script Language = "JavaScript">

<!- ​​Beginnen Sie

var Arritems1 = new Array ();

var Arritemsgrp1 = new Array ();

Arritems1 [3] = "Spalte zwei";

Arritemsgrp1 [3] = 1;

Arritems1 [4] = "Spalte zwei und drei";

Arritemsgrp1 [4] = 1;

Arritems1 [5] = "Spalte 24";

Arritemsgrp1 [5] = 1;

Arritems1 [6] = "Spalte drei";

Arritemsgrp1 [6] = 2;

Arritems1 [7] = "Spalte Dreifaltigkeit";

Arritemsgrp1 [7] = 2;

Arritems1 [0] = "Spalte vier";

Arritemsgrp1 [0] = 3;

Arritems1 [1] = "Spalte vier eins";

Arritemsgrp1 [1] = 3;

Arritems1 [2] = "Spalte 42";

Arritemsgrp1 [2] = 3;

var Arritems2 = new Array ();

var Arritemsgrp2 = new Array ();

Arritems2 [21] = "Spalte 4-0";

Arritemsgrp2 [21] = 0

Arritems2 [22] = "Spalte 4-1";

Arritemsgrp2 [22] = 0

Arritems2 [31] = "Spalte 41-0";

Arritemsgrp2 [31] = 1

Arritems2 [34] = "Spalte 41-1";

Arritemsgrp2 [34] = 1

Arritems2 [35] = "Spalte 42-0";

Arritemsgrp2 [35] = 2

Arritems2 [99] = "Spalte 24-2";

Arritemsgrp2 [99] = 5

Arritems2 [100] = "Spalte 24-1";

Arritemsgrp2 [100] = 5

Arritems2 [57] = "Spalte 24-0";

Arritemsgrp2 [57] = 5

Arritems2 [101] = "Spalte 2-0";

Arritemsgrp2 [101] = 3

Arritems2 [102] = "Spalte 2-1";

Arritemsgrp2 [102] = 3

Arritems2 [103] = "Spalte 23-0";

Arritemsgrp2 [103] = 4

Arritems2 [104] = "Spalte 23-1";

Arritemsgrp2 [104] = 4

Arritems2 [105] = "Spalte 3-0";

Arritemsgrp2 [105] = 6

Arritems2 [106] = "Spalte 3-1";

Arritemsgrp2 [106] = 6

Arritems2 [200] = "Spalte 31-0";

Arritemsgrp2 [200] = 7

Arritems2 [201] = "Spalte 31-1";

Arritemsgrp2 [201] = 7

Arritems2 [203] = "Spalte 31-2";

Arritemsgrp2 [203] = 7

Funktionsetelement (Steuerung, Steuerung, ItemArray, GroupArray)

{

var myele;

var x;

// leeren Sie die zweite Dropdown -Box aller Auswahlmöglichkeiten

für (var q = controlTopulate.options.Length; q> = 0; q-) controlTopulate.options [q] = null;

if (control.name == "firstchoice") {

// leeren Sie die dritte Dropdown -Box aller Auswahlmöglichkeiten

für (var q = myChoices.ThirdChoice.Options.Length;

}

// Standardauswahl hinzufügen - falls es keine Werte gibt

myele = document.createelement_x ("option");

myele.value = 0;

myele.text = "[list]";

ControlTopopulate.Add (myele);

für (x = 0; x <itemArray.length; x ++)

{

if (GroupArray [x] == Control.Value)

{

myele = document.createelement_x ("option");

myele.value = x;

myele.text = itemArray [x];

ControlTopopulate.Add (myele);

}

}

}

// Ende ->

</script>

<Formular name = myChoices>

<Table Align = "Center">

<tr>

<td>

<Select id = firstchoice name = firstchoice onchange = "selektionChange (this, myChoices.secondChoice, Arritems1, Arritemsgrp1);">

<Option Value = "0"> LISTE ONE </option>

<Option Value = "1"> Liste 2 </Option>

<Option Value = "2"> LISTE DREI </option>

<Option Value = "3"> LISTE Four </option>

</Select>

</Td> <td>

<Select id = SecondChoice name = SecondChoice onchange = "selektionChange (this, myChoices.Thirdchoice, Arritems2, Arritemsgrp2);">

</Select>

<SELECT ID = Thirdchoice Name = Thirdchoice>

</Select>

</Td>

</Tr>

</Table>

</form>

Ich hoffe, dieser Artikel wird für JavaScript -Programme aller hilfreich sein.