在不同的下拉菜單中使用數組中的相同值

我正在使這家酒店預訂form，或至少試圖使其工作。但是在我完成目標的道路上，我遇到了一些問題。我得到了兩個不同的drop-down menu's，我想要從相同的array中檢索信息，因爲它們都包含相同的信息。在不同的下拉菜單中使用數組中的相同值

如果我所說的任何事情看起來不清楚或廣泛，請在抱怨之前詢問，我會盡我所能解釋。

編輯：我說的兩個菜單是兩個值「selectRom」。

<html> 
    <head> 
     <meta charset="UTF-8"> 
     <style> 

     </style> 

     <title> 

     </title> 

    </head> 

    <body> 


    <div> 
    <select id="selectNumber"> 
    <option>Velg ett sted</option> 
    </select> 
    <input type="date"> 
    <input type="number"> 
    <br><select id="selectRom"> 
    <option>Antall singel rom</option> 
    </select> 

    <br> <select id="selectRom"> 
    <option>Antall singel rom</option> 
    </select> 
    <br>Skipass:<input type="checkbox" id="skiPass"> 
    <br>Skiutstyr:<input type="checkbox" id="skiUtstyr"> 




    </div> 

    <script> 
    var select = document.getElementById("selectNumber"); 
    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); 
    } 
    var select = document.getElementById("selectRom"); 
    var options = ["1", "2", "3"]; 
    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); 
    } 

    </script> 
    </body> 
</html>

aditional的問題，沒有涉及到的主要問題，如果有人知道如何使這整個事情變成一個計算器，根據什麼信息被輸入的計算，我將不勝感激，如果有人能好心解釋或嘗試教我。 的jsfiddle： https://jsfiddle.net/wa1fyLa7/

來源

2016-06-08 ImNewToThis

這太可怕了編碼的做法是使用相同的'id'多個元素。 –

而不是抱怨新來的人，你能提供建設性的反饋。 – ImNewToThis

這不是抱怨，這是違反標準，可能會導致錯誤。 –

https://jsfiddle.net/wa1fyLa7/5/

注：請不要使用同一ID多次。

<body> 


    <div> 
    <select id="selectNumber"> 
    <option>Velg ett sted</option> 
    </select> 
    <input type="date"> 
    <input type="number"> 
    <br><select id="selectRom"> 
    <option>Antall singel rom</option> 
    </select> 

    <br> <select id="selectRom2"> 
    <option>Antall singel rom</option> 
    </select> 
    <br>Skipass:<input type="checkbox" id="skiPass"> 
    <br>Skiutstyr:<input type="checkbox" id="skiUtstyr"> 




    </div> 

    <script> 
    var select = document.getElementById("selectNumber"); 
    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); 
    } 
    var select = document.getElementById("selectRom"); 
    var select2 = document.getElementById("selectRom2"); 
    var options = ["1", "2", "3"]; 
    for(var i = 0; i < options.length; i++) { 
    var opt = options[i]; 
    var el = document.createElement("option"); 
    el.textContent = opt; 
    el.value = opt; 
    var el2 = document.createElement("option"); 
    el2.textContent = opt; 
    el2.value = opt; 
    select.appendChild(el); 
    select2.appendChild(el2); 
    } 

    </script> 
    </body>

來源

2016-06-08 09:09:36

謝謝！正是我需要:) – ImNewToThis

快樂編碼@ImNewToThis –

https://jsfiddle.net/wa1fyLa7/1/

我改變了對ELEM類，而不是ID。

var select = document.getElementsByClassName("selectRom"); 
    console.log(select); 
    var options = ["1", "2", "3"]; 
    for(var j = 0; j < select.length; j++) { 
    var elem = select[j]; 
    for(var i = 0; i < options.length; i++) { 
     var opt = options[i]; 
     var el = document.createElement("option"); 
     el.textContent = opt; 
     el.value = opt; 
     elem.appendChild(el); 
    } 

    }

來源

2016-06-08 09:06:49

也許你想做到這一點

<body> 
 

 

 
    <div> 
 
    <select id="selectNumber"> 
 
     <option>Velg ett sted</option> 
 
    </select> 
 
    <input type="date"> 
 
    <input type="number"> 
 
    <br> 
 
    <select id="selectRom"> 
 
     <option>Antall singel rom</option> 
 
    </select> 
 

 
    <br> 
 
    <select id="selectRom2"> 
 
     <option>Antall singel rom</option> 
 
    </select> 
 
    <br>Skipass: 
 
    <input type="checkbox" id="skiPass"> 
 
    <br>Skiutstyr: 
 
    <input type="checkbox" id="skiUtstyr"> 
 

 

 

 

 
    </div> 
 

 
    <script> 
 
    var select = document.getElementById("selectNumber"); 
 
    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); 
 
    } 
 
    add("selectRom"); 
 
    add("selectRom2"); 
 

 
    function add(idN) { 
 
     var select = document.getElementById(idN); 
 
     var options = ["1", "2", "3"]; 
 
     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); 
 
     } 
 
     } 
 
     //var select = document.getElementById("selectRom"); 
 
     //var options = ["1", "2", "3"]; 
 
     //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); 
 
     //} 
 
    </script> 
 
</body>

來源

2016-06-08 09:24:30 McClinton

在不同的下拉菜單中使用數組中的相同值

回答

相關問題