Javascript 如何使用jQuery筛选选项？

如何筛选选项

当我选择城市电影院和剧院时，在我选择电影院或剧院以更改电影院播放或剧院播放电影之后，会出现下拉列表

如果我选择了一个选项来显示选项相关信息

下面是我的html代码

$（文档）.ready（函数（）{
var cityData=[{
城市名称：“班加鲁”，
价值：“班加鲁”，
数据：[{
电影名称：“ABC”，
剧院名称：“图尔西剧院”
},
{
movieName:'DEF'，
名称：“PVR”
},
{
电影名称：“GHI”，
剧院名称：“斯里尼瓦萨剧院”
}
]
},
{
城市名称：“海得拉巴”，
价值：“海得拉巴”，
数据：[{
电影名称：“123”，
剧院名称：“剧院1”
},
{
电影名称：“456”，
域名：“PVR2”
},
{
电影名称：“789”，
剧院名称：“剧院3”
}
]
},
{
城市名称：“Guntur”，
值：“Guntur”，
数据：[{
电影名称：“ABC1”，
剧院名称：“剧院4”
},
{
movieName:'DEF2'，
名称：“PVR3”
},
{
movieName:‘GHI3’，
剧院名称：“剧院5”
}
]
},
{
城市名称：“Ongole”，
值：“Ongole”，
数据：“当前不可用”
}
];
$（“#selectCity”）。在（'change'，function（）上{
var locations=cityData.filter（c=>c.cityName===$（this.val（））[0]。数据；
var locationString=''；
var locationString2=''；
控制台日志（位置）
$。每个（位置、功能（i、项目）{
log（JSON.stringify（item））；
locationString+=''+item.theaterName+''；
locationString2+=''+item.movieName+''；
});
$（'#secondselectbox'）.html（locationString）；
$（'thirdselectbox'）.html（locationString2）；
});
});

我的电影票预订
选择城市
班加罗尔
海得拉巴
冈图尔
昂格尔

$（文档）.ready（函数（）{
var cityData=[{
城市名称：“班加鲁”，
价值：“班加鲁”，
数据：[{
电影名称：“ABC”，
剧院名称：“图尔西剧院”
},
{
movieName:'DEF'，
名称：“PVR”
},
{
电影名称：“GHI”，
剧院名称：“斯里尼瓦萨剧院”
}
]
},
{
城市名称：“海得拉巴”，
价值：“海得拉巴”，
数据：[{
电影名称：“123”，
剧院名称：“剧院1”
},
{
电影名称：“456”，
域名：“PVR2”
},
{
电影名称：“789”，
剧院名称：“剧院3”
}
]
},
{
城市名称：“Guntur”，
值：“Guntur”，
数据：[{
电影名称：“ABC1”，
剧院名称：“剧院4”
},
{
电影名称：“ABC1”，
名称：“PVR3”
},
{
movieName:‘GHI3’，
剧院名称：“剧院5”
}
]
},
{
城市名称：“Ongole”，
值：“Ongole”，
数据：“当前不可用”
}
];
$（“#selectCity”）。在（'change'，function（）上{
var locations=cityData.filter（c=>c.cityName===$（this.val（））[0]。数据；
var locationString2=''；
控制台日志（位置）
$。每个（位置、功能（i、项目）{
locationString2+=''+item.movieName+''；
});
$（'thirdselectbox'）.html（locationString2）；
CreateTheateDropdown（）；
});
$（“#thirdselectbox”）。在（'change'，function（）上{
CreateTheateDropdown（）；
});
函数createTheateDropdown（）{
var locations=cityData.filter（c=>c.cityName===$（'#selectCity'）.val（））[0]。数据；
var movie=locations.filter（c=>c.movieName===$（'thirdselectbox'）.val（））；
var locationString=''；
$。每个（电影、功能（i、项目）{
locationString+=''+item.theaterName+''；
})
$（'#secondselectbox'）.html（locationString）；
}
})

我的电影票预订
选择城市
班加罗尔
海得拉巴
冈图尔
昂格尔
或者，您可以通过添加自定义属性，即：
data theater=item.theaterName
来确保每部电影都与影院相关联

然后，您可以使用剧院下拉列表的更改事件来隐藏/显示相关电影，而不是不断地重新构建DOM


$（文档）.ready（函数（）{
var cityData=[{
城市名称：“班加鲁”，
价值：“班加鲁”，
数据：[{
电影名称：“ABC”，
剧院名称：“图尔西剧院”
},
{
movieName:'DEF'，
名称：“PVR”
},
{
电影名称：“GHI”，
剧院名称：“斯里尼瓦萨剧院”
}
]
},
{
城市名称：“海得拉巴”，
价值：“海得拉巴”，
数据：[{
电影名称：“123”，
剧院名称：“剧院1”
},
{
电影名称：“456”，
域名：“PVR2”
},
{
电影名称：“789”，
剧院名称：“剧院3”
}
]
},
{
城市名称：“Guntur”，
值：“Guntur”，
数据：[{
电影名称：“ABC1”，
剧院名称：“剧院4”
},
{
movieName:'DEF2'，
名称：“PVR3”
},
{
movieName:‘GHI3’，
剧院名称：“剧院5”
}
]
},
{
城市名称：“Ongole”，
值：“Ongole”，
数据：“当前不可用”
}
];
$（“#selectCity”）。在（'change'，function（）上{
var locations=cityData.filter（c=>c.cityName===$（this.val（））[0]。数据；
var locationString=''；
var locationString2=''；