我有 3 个下拉框，其中包含年龄、运动和关系的值，当我们打开网页时，它们的所有元素都会被加载。
年龄 = [0-10, 10-20, 20-30, 30-40]
运动 = [足球、网球、高尔夫、国际象棋]
关系 = [儿子、兄弟、父亲、朋友]
现在，所有三个元素都与映射相互关联。例如，20-30 岁的人可以是儿子、兄弟或朋友；并且可以踢足球、网球或国际象棋。
我希望这些下拉列表是动态的，即，在选择任何下拉列表的任何值时，相关选项将显示在其他两个下拉列表中。我认为不应该是 ajax 调用，因为所有字段都已加载到客户端。
谁能告诉我如何使用 javascript（或任何其他方式）在 HTML 中完成此操作？任何帮助都会很棒。谢谢。