Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/373.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 嵌套下拉列表不工作_Javascript_List - Fatal编程技术网

Javascript 嵌套下拉列表不工作

Javascript 嵌套下拉列表不工作,javascript,list,Javascript,List,因此,我想创建一个下拉列表“大陆”,并根据所选的大陆,显示另一个包含相应国家的下拉列表 我可以创建“大陆”下拉列表,但当我点击大陆时,它不会显示国家。你知道我的代码有什么问题吗 我的HTML代码是: <!DOCTYPE html> 挑选 非洲 美国 亚洲 大洋洲 欧洲 挑选 阿尔及利亚 安哥拉 贝宁 博茨瓦纳 布基纳法索 布隆迪 喀麦隆 佛得角 中非共和国 查德 科摩罗 刚果 刚果民主共和国 吉布提 埃及 赤道几内亚 厄立特里亚 埃塞俄比亚 加蓬 冈比亚 加纳 几尼 几内

因此,我想创建一个下拉列表“大陆”,并根据所选的大陆,显示另一个包含相应国家的下拉列表

我可以创建“大陆”下拉列表,但当我点击大陆时,它不会显示国家。你知道我的代码有什么问题吗

我的HTML代码是:

<!DOCTYPE html>


挑选
非洲
美国
亚洲
大洋洲
欧洲
挑选
阿尔及利亚
安哥拉
贝宁
博茨瓦纳
布基纳法索
布隆迪
喀麦隆
佛得角
中非共和国
查德
科摩罗
刚果
刚果民主共和国
吉布提
埃及
赤道几内亚
厄立特里亚
埃塞俄比亚
加蓬
冈比亚
加纳
几尼
几内亚比绍
象牙海岸
肯尼亚
莱索托
利比里亚
利比亚
马达加斯加
马拉维
马里
毛里塔尼亚
毛里求斯
摩洛哥
莫桑比克
纳米比亚
尼日尔
尼日利亚
卢旺达
圣多美和普林西比
塞内加尔
塞舌尔
塞拉利昂
索马里
南非
南苏丹
苏丹
斯威士兰
坦桑尼亚
多哥
突尼斯
乌干达
赞比亚
津巴布韦
挑选
安提瓜和巴布达
巴哈马
阿根廷
巴巴多斯
伯利兹
玻利维亚
巴西
加拿大
开曼群岛
智利
智利
哥伦比亚
古巴哥斯达黎加
多米尼加
多米尼加共和国
厄瓜多尔
萨尔瓦多
法屬圭亞那
格陵兰岛
格林纳达
危地马拉
圭亚那
海地
洪都拉斯
牙买加
墨西哥
尼加拉瓜
巴拿马
巴拉圭
秘鲁
波多黎各
圣基茨和尼维斯
圣卢西亚
圣文森特和格林纳丁斯
苏里南
特立尼达和多巴哥
特克斯和凯科斯群岛
美国
乌拉圭
委内瑞拉
挑选
阿富汗
巴林
孟加拉国
不丹
文莱
柬埔寨
中国
东帝汶
印度
印度尼西亚
伊朗
伊拉克
以色列
日本
乔丹
哈萨克斯坦
朝鲜
韩国
科威特
吉尔吉斯斯坦
老挝
黎巴嫩
马来西亚
马尔代夫
蒙古国
缅甸(缅甸)
尼泊尔
阿曼
巴基斯坦
菲律宾
卡塔尔
俄罗斯
沙特阿拉伯
新加坡
斯里兰卡
叙利亚
台湾
塔吉克斯坦
泰国
土耳其
土库曼斯坦
阿拉伯联合酋长国
乌兹别克斯坦
越南
也门
澳大利亚
斐济
基里巴斯
马绍尔群岛
密克罗尼西亚
瑙鲁
新西兰
帕劳
巴布亚新几内亚
萨摩亚
所罗门群岛
汤加
图瓦卢
瓦努阿图
阿尔巴尼亚
安道尔
亚美尼亚
奥地利
阿塞拜疆
白俄罗斯
比利时
波斯尼亚和黑塞哥维那
保加利亚
克罗地亚
塞浦路斯
捷克共和国
丹麦
爱沙尼亚
芬兰
法国
佐治亚州
德国
希腊
匈牙利
冰岛
爱尔兰
意大利
科索沃
拉脱维亚
列支敦士登
立陶宛
卢森堡
马其顿
马耳他
摩尔多瓦
摩纳哥
黑山
荷兰
挪威
波兰
葡萄牙
罗马尼亚
俄罗斯
圣马力诺
塞尔维亚
斯洛伐克
斯洛文尼亚
西班牙
瑞典
瑞士
土耳其
乌克兰
大不列颠联合王国
梵蒂冈城(罗马教廷)

我的JavaScript代码是

<script language="javascript">
$("#continents").change(function(){
   var value = $(this).val();
     $("#countries").css('display','none'); 
    $("."+value).css('display','block'); 

});

$(“#大陆”)。更改(函数(){
var值=$(this.val();
$(“#国家”).css('display','none');
$(“+value).css('display','block');
});
}))


保持道德便利永远不要复制ID,将其更改为类并查看其工作情况,也可以将其重写为

$("#continents").change(function(){
     $(".countries").not($("."+this.value).show()).hide(); 
});


如果复制id并将id选择器与vanilla JS或jquery或其他任何东西一起使用,它将只选择在DOM中显示该id的第一个元素。但是您可以使用属性选择器选择id。例如,
$(“[id='countries']”).css('display','none')
,但不要使用它。

乍一看,您选择的所有项目都有国家id。ID必须是唯一的。
$("#continents").change(function(){
     $(".countries").not($("."+this.value).show()).hide(); 
});