基於另一個下拉更新下拉值 - jQuery

Question

這裏是fiddle

我在我的HTML中有兩個下拉項。

where from和where to

你必須選擇where from前where to充滿了選擇。

含有不同地方的陣列看起來像這樣：where from選擇

var allCities = ["Napoli", "Palermo", "Cagliari", "Barcelona", "Malaga", "Rio de Janeiro"]; 

後，我想在where to與具有比一個較高的指數數組中的項目，以更新值首先選擇。

E.g.如果我選擇卡利亞里作爲我的where from。

我的where to應顯示Barcelona, Malaga, Rio de Janeiro，但我的where to下拉菜單永遠不會獲取任何值。

任何幫助，非常感謝。

Answer 1

幾件事情，

首先，您需要更改$("#travel_from").on("selectmenuchange", ...到$("#travel_from").on("change", ...

您還需要清除travel_to城市每個你做這個活動的時候，像這樣

$('#travel_to').find('option').remove(); 

如果您希望首先禁用travel_to下拉菜單，則需要在您的HTML中提供selectdisabled屬性，然後在執行操作時將其刪除變化事件。

HTML

<select id="travel_to" disabled> 

JS

$('#travel_to').prop('disabled', false); 

就是這樣。這應該是你正在尋找的東西，這裏是一個complete fiddle