Método de implementación del menú desplegable de enlace múltiple en JavaScript

Este artículo describe el método para implementar menús desplegables de enlace multinivel en JavaScript. Compártelo para su referencia. El método de implementación específico es el siguiente:

La copia del código es la siguiente:

<Script language = "javaScript">

<!- ​​Comienza

var arreitems1 = new Array ();

var arreitemSgrp1 = new Array ();

Arritems1 [3] = "columna dos";

ArriteMSgrp1 [3] = 1;

Arritems1 [4] = "columna dos y tres";

ArriteMSgrp1 [4] = 1;

Arritems1 [5] = "columna 24";

ArriteMSgrp1 [5] = 1;

Arritems1 [6] = "columna tres";

ARITEMSGRP1 [6] = 2;

Arritems1 [7] = "columna Trinity";

ArriteMSgrp1 [7] = 2;

Arritems1 [0] = "columna cuatro";

ArriteMSgrp1 [0] = 3;

Arritems1 [1] = "Columna cuatro uno";

ArriteMSgrp1 [1] = 3;

Arritems1 [2] = "columna 42";

ArriteMSgrp1 [2] = 3;

var arreitems2 = new Array ();

var arritemSgrp2 = new Array ();

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

ArriteMSgrp2 [21] = 0

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

ArriteMSgrp2 [22] = 0

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

ArriteMSgrp2 [31] = 1

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

ArriteMSgrp2 [34] = 1

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

ArriteMSgrp2 [35] = 2

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

ArriteMSgrp2 [99] = 5

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

ArriteMSgrp2 [100] = 5

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

ArriteMSgrp2 [57] = 5

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

ArriteMSgrp2 [101] = 3

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

ArriteMSgrp2 [102] = 3

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

ARITEMSGRP2 [103] = 4

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

ArriteMSgrp2 [104] = 4

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

ArriteMSgrp2 [105] = 6

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

ArriteMSgrp2 [106] = 6

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

ArriteMSgrp2 [200] = 7

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

ArriteMSgrp2 [201] = 7

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

ArriteMSgrp2 [203] = 7

Función SelectChange (Control, ControlTopOpule, itemArray, groupArray)

{

var myele;

var x;

// vacía el segundo cuadro desplegable de cualquier opción

for (var q = controltopOpule.options.length; q> = 0; q--) ControlTopOpule.options [q] = null;

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

// vacía el tercer cuadro desplegable de cualquier opción

para (var q = mychoices.thirdchoice.options.length; q> = 0; q--) mychoices.thirdchoice.options [q] = null;

}

// Agregar opción predeterminada: en caso de que no haya valores

myele = document.createElement_x ("opción");

myele.Value = 0;

myele.Text = "[Lista]";

ControlTopOpule.Add (Myele);

para (x = 0; x <itemarray.length; x ++)

{

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

{

myele = document.createElement_x ("opción");

myele.Value = x;

myele.text = itemArray [x];

ControlTopOpule.Add (Myele);

}

}

}

// fin ->

</script>

<nombre de formulario = mychoices>

<table align = "centro">

<tr>

<TD>

<Seleccionar id = FirstChoice name = FirstChoice onChange = "SelectChange (this, mychoices.secondchoice, ArriteMs1, ArriteMSgrp1);">

<opción valor = "0"> Lista One </opción>

<opción valor = "1"> Lista 2 </opción>

<opción valor = "2"> Lista tres </opción>

<opción valor = "3"> Lista cuatro </opción>

</Select>

</td> <td>

<Seleccionar id = Secondchoice name = SecundChoice onChange = "SelectChange (this, mychoices.thirdChoice, ArriteMS2, ArriteMSgrp2);">

</Select>

<Seleccionar id = tercerChoice name = ThirdChoice>

</Select>

</td>

</tr>

</table>

</form>

Espero que este artículo sea útil para la programación de JavaScript de todos.