تصف هذه المقالة طريقة تنفيذ القوائم المنسدلة متعددة المستويات في JavaScript. شاركه للرجوع إليه. طريقة التنفيذ المحددة هي كما يلي:
نسخة الكود كما يلي:
<script language = "javaScript">
<!- ابدأ
var arritems1 = new array () ؛
var arritemsgrp1 = new array () ؛
arritems1 [3] = "العمود الثاني" ؛
arritemsgrp1 [3] = 1 ؛
arritems1 [4] = "العمود الثاني والثالث" ؛
arritemsgrp1 [4] = 1 ؛
arritems1 [5] = "العمود 24" ؛
arritemsgrp1 [5] = 1 ؛
arritems1 [6] = "العمود الثالث" ؛
arritemsgrp1 [6] = 2 ؛
arritems1 [7] = "عمود الثالوث" ؛
arritemsgrp1 [7] = 2 ؛
arritems1 [0] = "العمود الرابع" ؛
arritemsgrp1 [0] = 3 ؛
arritems1 [1] = "العمود الرابع واحد" ؛
arritemsgrp1 [1] = 3 ؛
arritems1 [2] = "العمود 42" ؛
arritemsgrp1 [2] = 3 ؛
var arritems2 = new array () ؛
var arritemsgrp2 = new array () ؛
arritems2 [21] = "العمود 4-0" ؛
arritemsgrp2 [21] = 0
arritems2 [22] = "العمود 4-1" ؛
arritemsgrp2 [22] = 0
arritems2 [31] = "العمود 41-0" ؛
arritemsgrp2 [31] = 1
arritems2 [34] = "العمود 41-1" ؛
arritemsgrp2 [34] = 1
arritems2 [35] = "العمود 42-0" ؛
arritemsgrp2 [35] = 2
arritems2 [99] = "العمود 24-2" ؛
arritemsgrp2 [99] = 5
arritems2 [100] = "العمود 24-1" ؛
arritemsgrp2 [100] = 5
arritems2 [57] = "العمود 24-0" ؛
arritemsgrp2 [57] = 5
arritems2 [101] = "العمود 2-0" ؛
arritemsgrp2 [101] = 3
arritems2 [102] = "العمود 2-1" ؛
arritemsgrp2 [102] = 3
arritems2 [103] = "العمود 23-0" ؛
arritemsgrp2 [103] = 4
arritems2 [104] = "العمود 23-1" ؛
arritemsgrp2 [104] = 4
arritems2 [105] = "العمود 3-0" ؛
arritemsgrp2 [105] = 6
arritems2 [106] = "العمود 3-1" ؛
arritemsgrp2 [106] = 6
arritems2 [200] = "العمود 31-0" ؛
arritemsgrp2 [200] = 7
arritems2 [201] = "العمود 31-1" ؛
arritemsgrp2 [201] = 7
arritems2 [203] = "العمود 31-2" ؛
arritemsgrp2 [203] = 7
وظيفة SelectChange (التحكم ، ControlTopopulate ، itemarray ، GroupArray)
{
فار مايلي
var x ؛
// تفريغ المربع الثاني المنسدلة من أي خيارات
لـ (var q = controlTopOpulate.Options.Length ؛ q> = 0 ؛
if (control.name == "firstChoice") {
// تفريغ المربع المنسدلة الثالثة من أي خيارات
لـ (var q = mychoices.thirdchoice.options.length ؛ q> = 0 ؛ q--) mychoices.thirdchoice.options [q] = null ؛
}
// إضافة الاختيار الافتراضي - في حالة عدم وجود قيم
myele = document.createelement_x ("الخيار") ؛
myele.value = 0 ؛
myele.text = "[list]" ؛
ControlTopopulate.add (myele) ؛
لـ (x = 0 ؛ x <itemarray.length ؛ x ++)
{
if (grouparray [x] == control.value)
{
myele = document.createelement_x ("الخيار") ؛
myele.value = x ؛
myele.text = itemArray [x] ؛
ControlTopopulate.add (myele) ؛
}
}
}
// end ->
</script>
<اسم النموذج = mychoices>
<table align = "center">
<tr>
<td>
<حدد ID = FirstChoice name = firstChoice onChange = "SelectChange (هذا ، mychoices.secondchoice ، arritems1 ، arritemsgrp1) ؛">>
<Option Value = "0"> اذكر واحد </option>
<Option Value = "1"> القائمة 2 </soph>
<Option Value = "2"> اذكر ثلاثة </Option>
<Option Value = "3"> اذكر أربعة </Option>
</select>
</td> <td>
<SELECT ID = SecondChoice name = SecondChoice OnChange = "SelectChange (هذا ، Mychoices.thirdchoice ، arritems2 ، arritemsgrp2) ؛">
</select>
<حدد ID = اسم ThirdChoice = ThirdChoice>
</select>
</td>
</r>
</table>
</form>
آمل أن تكون هذه المقالة مفيدة لبرمجة JavaScript للجميع.