指示下一个选择选项的HTML选择标记

伙计们，我想知道有没有办法：

例如，如果选择标签中的第一个问题是“汽车品牌”。然后选择例如“toyota”。下一个选项的下一个选择选项是丰田汽车的列表，如“凯美瑞、富兰克林等”。如果在第一个选项中选择“本田”，下一个选择选项将有“思域、crz、crv等”

---

因此，基本上，下一个选择标记将根据所选的第一个选项切换选项。最大的问题是，代码是否只针对HTML而不是CSS。提前感谢您的回复：）

一些JavaScript开始-每次选择框更改时，它都会将所选值与“模型”对象中的值匹配，并在模型选择框中显示结果

请选择
本田
丰田
$（函数（）{
$（'#makes'）。更改（函数（）{
var make=$（this.val（）；
var模型={
本田：{1:“思域”，2:“雅阁”}，
丰田：{1:“上文”，2:“雅利斯”}
};
if（型号hasOwnProperty（品牌））{
$（'#model'）.html（''）；
$。每个（型号[make]，功能（i，val）{
$（“#模型”）
.append（$（“”）
.attr（“值”，val）
.text（val））；
});
}
}); 
});

HTML是不可能的。在第一个select上定义onselect，然后可以使用AJAX（XHR）将选项填充到第二个select，或者预加载所有选项，只显示适当的选项并隐藏其他选项。第一个更好，第二个没有AJAX。这实际上是通过javascript完成的，因为您希望动态更改页面上显示的下一个选择选项。如果你试着自己做，然后只问你的代码是否有问题，那就更好了。

<select id="makes">
    <option value="NULL">Please Select</option>
    <option value="Honda">Honda</option>
    <option value="Toyota">Toyota</option>
</select>




<select id="model">
</select>



$(function(){
    $('#makes').change(function(){
       var make = $(this).val();
       var model = {
           Honda:{1:"Civic", 2:"Accord"},
           Toyota:{1:"Supra",2:"Yaris"}
       };


       if(model.hasOwnProperty(make)){
           $('#model').html('');

           $.each(model[make], function(i, val) {
               $('#model')
                    .append($("<option></option>")
                    .attr("value",val)
                    .text(val)); 
           });
       }
   }); 
});