배열로 메뉴를 드롭 다운 각 옵션의 값을 정의

Question

안녕하세요 Stackoverflow!

오늘 나는 array으로 drop-down menu을 만들려고했습니다. 작동했지만이 후에 발생하는 문제는 으로 인쇄 된 values을 정의하는 것입니다.

지금은 drop-down menu에 관한 코드입니다.

HTML

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

자바 스크립트

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

당신은 이런 식으로 뭔가를 찾고 계십니까? 가격과 장소 이름을 포함하도록 데이터를 업데이트했습니다. 이제 선택 영역에는 텍스트가 장소로, 가격이 값으로 사용됩니다. 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); 
}