用數組下拉菜單，定義每個選項的值

Question

你好還有Stackoverflow！

今天我試着用array做了一個drop-down menu。它確實有效，但之後發生的問題是定義array打印的values。

截至目前，這是關於drop-down menu的代碼。

HTML

<select id="selectDestinasjon"> 
    <option>Velg ett sted</option> 
</select> 

的Javascript

var select = document.getElementById("selectDestinasjon"); 
var options = ["Konsberg", "Trysil", "Beitostølen"]; 
for (var i = 0; i < options.length; i++) { 
    var opt = options[i]; 
    var el = document.createElement("option"); 
    el.textContent = opt; 
    el.value = opt; 
    select.appendChild(el); 
} 

但我想給每個選項的值，那我以後可以impliment成一個計算器，因爲我想進行預訂服務，其中每個選項具有不同的值，計算器從當前選定的選項中檢索信息，根據選定的選項設置價格。

如果有任何東西看起來不清楚或太少，請詳細詢問，我會盡我所能解釋。

的jsfiddle https://jsfiddle.net/a3pe6zcu/

Answer 1

您正在尋找這樣的事情？我已更新您的數據以保存該地點的價格和名稱。現在，select將文本作爲地點，價格作爲值。 Updated fiddle

var select = document.getElementById("selectDestinasjon"); 
var options = [{"place": "Konsberg","price":"$20"}, {"place":"Trysil","price":"$30"}, {"place":"Beitostølen","price":"$40"}]; 
for(var i = 0; i < options.length; i++) { 
var opt = options[i]; 
var el = document.createElement("option"); 
el.textContent = opt.place; 
el.value = opt.price; 
select.appendChild(el); 
}