附加和填充下拉列表多个javascript

这是否可以像在图像中一样将其转换为多个值。每当我点击另一个项目时，它将附加到子区域的另一个列表中，具体取决于区域列表数据，例如在区域中，我选择第一个区域，即

Agusan Del norte

，然后它将在Agusan Del norte下的子区域中弹出这些列表，然后，当我在区域中选择另一个项目时，如

Agusan Del Sur

，它会将列表附加到子区域。有可能吗？ 如果有人能找出我哪里做错了，那就太好了。事先非常感谢你

参考：

选择{宽度：150px；}

地区：
次区域：>
位置：

let data=[{“id”：1，“name”：“USA”，“parentid”：0}，
{“id”：2，“name”：“Japan”，“parentid”：0}，
{“id”：3，“名称”：“欧洲”，“父id”：0}，
{“id”：4，“name”：“California”，“parentid”：1}，
{“id”：5，“姓名”：“俄克拉荷马州”，“家长id”：1}，
{“id”：6，“姓名”：“亚利桑那州”，“家长id”：1}，
{“id”：7，“name”：“Kant”；“parentid”：2}，
{“id”：8，“name”：“Kansai”，“parentid”：2}，
{“id”：9，“name”：“Chügoku”，“parentid”：2}，
{“id”：10，“name”：“France”，“parentid”：3}，
{“id”：11，“name”：“Deutschland”，“parentid”：3}，
{“id”：12，“name”：“Espana”，“parentid”：3}，
{“id”：13，“name”：“Sacramento”，“parentid”：4}，
{“id”：14，“姓名”：“洛杉矶”，“家长id”：4}，
{“id”：15，“姓名”：“圣地亚哥”，“家长id”：4}，
{“id”：16，“name”：“Tulsa”，“parentid”：5}，
{“id”：17，“姓名”：“俄克拉荷马城”，“家长id”：5}，
{“id”：18，“name”：“Lawton”，“parentid”：5}，
{“id”：19，“name”：“Phoenix”，“parentid”：6}，
{“id”：20，“name”：“Flagstaff”，“parentid”：6}，
{“id”：21，“name”：“Tucson”，“parentid”：6}，
{“id”：21，“name”：“Tokyo”，“parentid”：7}，
{“id”：22，“name”：“Chiba”，“parentid”：7}，
{“id”：23，“name”：“Tochigi”，“parentid”：7}，
{“id”：24，“name”：“Kyoto”，“parentid”：8}，
{“id”：25，“姓名”：“大阪”，“父母id”：8}，
{“id”：26，“name”：“Nara”，“parentid”：8}，
{“id”：27，“name”：“Tottori”，“parentid”：9}，
{“id”：28，“name”：“Hirochima”，“parentid”：9}，
{“id”：29，“name”：“Okayama”，“parentid”：9}，
{“id”：30，“name”：“Quimper”，“parentid”：10}，
{“id”：31，“name”：“Toulouse”，“parentid”：10}，
{“id”：32，“name”：“Nancy”，“parentid”：10}，
{“id”：33，“name”：“Dusseldorf”，“parentid”：11}，
{“id”：34，“姓名”：“莱比锡”，“家长id”：11}，
{“id”：35，“name”：“Munchen”，“parentid”：11}，
{“id”：36，“姓名”：“巴塞罗那”，“家长id”：12}，
{“id”：37，“姓名”：“塞维利亚”，“家长id”：12}，
{“id”：38，“name”：“Guernica”，“parentid”：12}]
函数populateList（列表、PID）{
设l=document.getElementById（列表）；
l、 innerHTML=“”；
让topItem=document.createElement（“选项”）；
topItem.value=0；
topItem.text=“--选择--”；
l、 附加子项（topItem）；
让items=data.filter（item=>pids.includes（item.parentid））；
items.forEach（功能（项目）{
让newItem=document.createElement（“选项”）；
newItem.value=item.id；
newItem.text=item.name；
l、 追加子项（新项）；
})
}
函数更新列表（selList，thisList）{
让值=[]；
for（设i=0；i0&&value[0]！=0）{
大众列表（selList，values）；
}否则{
设s=document.getElementById（selList）；
s、 数值=0；
触发事件（“变更”）；
设为s.cloneNode（假）；
设p=s.parentNode；
p、 替换儿童（s）；
}
}
功能触发器事件（e，触发器）
{
if（（e[触发器]| | false）&&typeof e[触发器]=“函数”）
{
e[触发]（e）；
}
}
函数loadList1（）{
大众列表（“列表1”，[0]）；
}
window.onload=loadList1
选择{宽度：150px；}
地区：
次区域：
位置：
let data=[{“id”：1，“name”：“USA”，“parentid”：0}，
{“id”：2，“name”：“Japan”，“parentid”：0}，
{“id”：3，“名称”：“欧洲”，“父id”：0}，
{“id”：4，“name”：“California”，“parentid”：1}，
{“id”：5，“姓名”：“俄克拉荷马州”，“家长id”：1}，
{“id”：6，“姓名”：“亚利桑那州”，“家长id”：1}，
{“id”：7，“name”：“Kant”；“parentid”：2}，
{“id”：8，“name”：“Kansai”，“parentid”：2}，
{“id”：9，“name”：“Chügoku”，“parentid”：2}，
{“id”：10，“name”：“France”，“parentid”：3}，
{“id”：11，“name”：“Deutschland”，“parentid”：3}，
{“id”：12，“name”：“Espana”，“parentid”：3}，
{“id”：13，“name”：“Sacramento”，“parentid”：4}，
{“id”：14，“姓名”：“洛杉矶”，“家长id”：4}，
{“id”：15，“姓名”：“圣地亚哥”，“家长id”：4}，
{“id”：16，“name”：“Tulsa”，“parentid”：5}，
{“id”：17，“姓名”：“俄克拉荷马城”，“家长id”：5}，
{“id”：18，“name”：“Lawton”，“parentid”：5}，
{“id”：19，“name”：“Phoenix”，“parentid”：6}，
{“id”：20，“name”：“Flagstaff”，“parentid”：6}，
{“id”：21，“name”：“Tucson”，“parentid”：6}，
{“id”：21，“name”：“Tokyo”，“parentid”：7}，
{“id”：22，“name”：“Chiba”，“parentid”：7}，
{“id”：23，“name”：“Tochigi”，“parentid”：7}，
{“id”：24，“name”：“Kyoto”，“parentid”：8}，
{“id”：25，“姓名”：“大阪”，“父母id”：8}，
{“id”：26，“name”：“Nara”，“parentid”：8}，
{“id”：27，“name”：“Tottori”，“parentid”：9}，
{“id”：28，“name”：“Hirochima”，“parentid”：9}，
{“id”：29，“name”：“Okayama”，“parentid”：9}，
{“id”：30，“name”：“Quimper”，“parentid”：10}，
{“id”：31，“name”：“Toulouse”，“parentid”：10}，
{“id”：32，“name”：“Nancy”，“parentid”：10}，
{“id”：33，“name”：“Dusseldorf”，“parentid”：11}，
{“id”：34，“姓名”：“莱比锡”，“家长id”：11}，
{“id”：35，“name”：“Munchen”，“parentid”：11}，
{“id”：36，“姓名”：“巴塞罗那”，“家长id”：12}，
{“id”：37，“姓名”：“塞维利亚”，“家长id”：12}，
{“id”：38，“name”：“Guernica”，“parentid”：12}]
函数populateList（列表、道具）{
如果（道具[0]。值！=-1）{
设l=document.getElementById（列表）；
l、 innerHTML=“”；
让topItem=document.createElement（“选项”）；
topItem.value=-1；
topItem.text=“--选择--”；
l、 附加子项（topItem）；
for（设i=0；i<select class="select2-icons form-control" name = "list1"  id="list1" multiple="multiple" onchange="updateList('list2', this);"></select>