根據另一個選擇列表值選擇選擇列表值

我在網頁中有兩個選擇框（一個用於汽車類型，另一個用於汽車模型），我想根據另一個使用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>

我應該在代碼中進行兩個下拉列表之間的這種依賴性寫？

來源

2011-08-18 TopDeveloper

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

你可以用HTML + javascript + CSS來實現，但是一旦你的結構增長了，它將很難維護。打字錯誤也很容易，而且很難測試。更好的解決方案是使用AJAX - 爲數據庫中的所有類別存儲值，並使用服務器返回的選項創建新的選擇。您將擁有通用的解決方案，並添加新的類別+值只是將記錄添加到數據庫中，無需更改html + js + css。

UPDATE：

我不知道你用什麼語言後端，如果是PHP的，那麼你可以在這裏看看：w3schools ajax example。如果你使用別的東西，那麼想法保持不變。這裏你有beginning of ajax tutorial by w3schools。該示例在從select中選擇名稱後顯示個人信息，但您可以將輸出包裝在select標籤中併爲每個輸出生成選項。

來源

2011-08-18 09:13:02 mkk

我需要使用這種方式作爲解決方案，因爲我嘗試使用數據庫，並且數據庫語言編碼存在問題，因此這些選項以錯誤的格式顯示，無法理解。 – TopDeveloper

謝謝，我希望你給我發一個適用於我的情況的例子，就像問題中提到的那樣。 – TopDeveloper

我會編輯我的答案 – mkk

根據另一個選擇列表值選擇選擇列表值

回答

相關問題