源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

javascript实现多级联动下拉菜单的方法

  • 时间:2020-03-04 05:43 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:javascript实现多级联动下拉菜单的方法
本文实例讲述了javascript实现多级联动下拉菜单的方法。分享给大家供大家参考。具体实现方法如下:
[u]复制代码[/u] 代码如下:
<SCRIPT LANGUAGE="JavaScript"> <!-- Begin var arrItems1 = new Array(); var arrItemsGrp1 = new Array(); arrItems1[3] = "列二"; arrItemsGrp1[3] = 1; arrItems1[4] = "列二三"; arrItemsGrp1[4] = 1; arrItems1[5] = "列二四"; 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] = "列四二"; 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 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 = "[列表]" ;   controlToPopulate.add(myEle) ; for ( 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) ;         }     } } //  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">列表一</option>   <option value="1">列表二</option>   <option value="2">列表三</option>   <option value="3">列表四</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>
希望本文所述对大家的javascript程序设计有所帮助。
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部