Artikel ini menjelaskan metode menerapkan menu drop-down multi-level dalam JavaScript. Bagikan untuk referensi Anda. Metode implementasi spesifik adalah sebagai berikut:
Salinan kode adalah sebagai berikut:
<Bahasa skrip = "javascript">
<!- Mulailah
var arritems1 = array baru ();
var arritemsgrp1 = array baru ();
arritems1 [3] = "kolom dua";
arritemsgrp1 [3] = 1;
arritems1 [4] = "kolom dua dan tiga";
arritemsgrp1 [4] = 1;
arritems1 [5] = "kolom 24";
arritemsgrp1 [5] = 1;
arritems1 [6] = "kolom tiga";
arritemsgrp1 [6] = 2;
arritems1 [7] = "kolom trinitas";
arritemsgrp1 [7] = 2;
arritems1 [0] = "kolom empat";
arritemsgrp1 [0] = 3;
arritems1 [1] = "kolom empat satu";
arritemsgrp1 [1] = 3;
arritems1 [2] = "kolom 42";
arritemsgrp1 [2] = 3;
var arritems2 = array baru ();
var arritemsgrp2 = array baru ();
arritems2 [21] = "Kolom 4-0";
arritemsgrp2 [21] = 0
arritems2 [22] = "kolom 4-1";
arritemsgrp2 [22] = 0
arritems2 [31] = "Kolom 41-0";
arritemsgrp2 [31] = 1
arritems2 [34] = "kolom 41-1";
arritemsgrp2 [34] = 1
arritems2 [35] = "Kolom 42-0";
arritemsgrp2 [35] = 2
arritems2 [99] = "kolom 24-2";
arritemsgrp2 [99] = 5
arritems2 [100] = "kolom 24-1";
arritemsgrp2 [100] = 5
arritems2 [57] = "Kolom 24-0";
arritemsgrp2 [57] = 5
arritems2 [101] = "Kolom 2-0";
arritemsgrp2 [101] = 3
arritems2 [102] = "kolom 2-1";
arritemsgrp2 [102] = 3
arritems2 [103] = "Kolom 23-0";
arritemsgrp2 [103] = 4
arritems2 [104] = "Kolom 23-1";
arritemsgrp2 [104] = 4
arritems2 [105] = "Kolom 3-0";
arritemsgrp2 [105] = 6
arritems2 [106] = "Kolom 3-1";
arritemsgrp2 [106] = 6
arritems2 [200] = "Kolom 31-0";
arritemsgrp2 [200] = 7
arritems2 [201] = "kolom 31-1";
arritemsgrp2 [201] = 7
arritems2 [203] = "kolom 31-2";
arritemsgrp2 [203] = 7
Fungsi SelectChange (Control, ControlTopopulate, ItemArray, GroupArray)
{
var myele;
var x;
// Kosongkan kotak drop down kedua dari setiap pilihan
untuk (var q = controltopopulate.options.length; q> = 0; q--) controltopopulate.options [q] = null;
if (control.name == "firstChoice") {
// Kosongkan kotak drop down ketiga dari pilihan apa pun
untuk (var q = mychoices.thirtchoice.options.length; q> = 0; q--) mychoices.thirtchoice.options [q] = null;
}
// Tambahkan pilihan default - jika tidak ada nilai
myele = document.createelement_x ("opsi");
myele.value = 0;
myele.text = "[list]";
controltopopulate.add (myele);
untuk (x = 0; x <itemArray.length; x ++)
{
if (groupArray [x] == control.value)
{
myele = document.createelement_x ("opsi");
myele.value = x;
myele.text = itemArray [x];
controltopopulate.add (myele);
}
}
}
// end ->
</script>
<Form name = mychoices>
<tabel align = "center">
<tr>
<td>
<Pilih ID = Nama FirstChoice = FirstChoice Onchange = "SelectChange (ini, mychoices.secondChoice, arritems1, arritemsgrp1);">
<Option value = "0"> Daftar satu </pection>
<Option value = "1"> Daftar 2 </pection>
<Option value = "2"> Daftar tiga </pection>
<Option value = "3"> Daftar empat </tiption>
</Pilih>
</td> <td>
<Pilih ID = Nama SecondChoice = SecondChoice Onchange = "SelectChange (Ini, MyChoices.TheRdChoice, Arritems2, ArritemsGrp2);">
</Pilih>
<Pilih ID = Nama ChhireChoice = ThirdChoice>
</Pilih>
</td>
</tr>
</boable>
</form>
Saya harap artikel ini akan membantu pemrograman JavaScript semua orang.