根据另一个选择列表值选择选择列表值

问题描述：

我在网页中有两个选择框（一个用于汽车类型，另一个用于汽车模型），我想根据另一个使用JavaScript更改其中的一个。根据另一个选择列表值选择选择列表值

的代码示例是，如下：

<html> 

<head> 
<script type="text/javascript"> 

function showCarModels(CarTypeVaraiable) 
{ 

//I want to hide all the options in the CarModelsList and select the options with name property value equals to CarTypeVaraiable Value .. How I can write this in JavaScript ????? 

} 
</script> 

</head> 

</script> 

<body> 

<p>Selecting Car Models depending on the Car Type Value ..... </p> 

Car Type<select id="selCarType" name="selCarType" class="selCarType" size="1" onchange="showCarModels('selCarType');">      
<option class="City" value="0" selected="selected">choose Car Type</option> 
<option class="CarType" value="100" >Toyota</option> 
<option class="CarType" value="200" >Chevrlolet</option> 
<option class="CarType" value="300" >Kia</option> 
</select> 

Car Model 
<select id="selCarModel" name="selCarModel" class="selCarModel" size="1"> 

<option class="City" value="0">choose Car Model</option> 

<option class="CarType" value="110" name="100" title="13" >Toyota optra</option> 
<option class="CarType" value="120" name="100" title="13" >Toyota Aveo</option>   
<option class="CarType" value="130" name="100" title="13" >Toyota Corolla</option> 

<option class="CarType" value="210" name="200" title="13" >Chevrlolet Optra</option> 
<option class="CarType" value="220" name="200" title="13" >Chevrlolet Aveo</option> 

<option class="CarType" value="301" name="300" title="13" >Kia Rio</option> 
<option class="CarType" value="450" name="300" title="13" >Kia Optima</option> 
<option class="CarType" value="600" name="300" title="13" >Kia Serato</option> 

</select> 

</body> 

</html>

我应该在代码中进行两个下拉列表之间的这种依赖性写？

嗯......你不能在'

答

你可以用HTML + javascript + CSS来实现，但是一旦你的结构增长了，它将很难维护。打字错误也很容易，而且很难测试。更好的解决方案是使用AJAX - 为数据库中的所有类别存储值，并使用服务器返回的选项创建新的选择。您将拥有通用的解决方案，并添加新的类别+值只是将记录添加到数据库中，无需更改html + js + css。

UPDATE：

我不知道你用什么语言后端，如果是PHP的，那么你可以在这里看看：w3schools ajax example。如果你使用别的东西，那么想法保持不变。这里你有beginning of ajax tutorial by w3schools。该示例在从select中选择名称后显示个人信息，但您可以将输出包装在select标签中并为每个输出生成选项。

我需要使用这种方式作为解决方案，因为我尝试使用数据库，并且数据库语言编码存在问题，因此这些选项以错误的格式显示，无法理解。 – TopDeveloper

谢谢，我希望你给我发一个适用于我的情况的例子，就像问题中提到的那样。 – TopDeveloper

我会编辑我的答案 – mkk

根据另一个选择列表值选择选择列表值

相关推荐