添加更多下拉框

Question

我有，默認情況下，一個選擇框車：

<select name="cars[]"> 
<option value="volvo">Volvo</option> 
<option value="saab">Saab</option> 
<option value="mercedes">Mercedes</option> 
<option value="audi">Audi</option> 
</select> 

但我想一個鏈接，說「添加其他汽車」，這將創建一個相同的下拉框，以便當它提交時，將提交卡片[0] =值和汽車[2]值。每次用戶點擊「添加另一輛車」時，他們都可以根據自己的喜好創建新的下拉框。

Answer 1

試試這個：

cloneNode創建一個指定節點的精確副本。

var container = document.getElementById('container'); 
 
var onAddClick = function() { 
 
    var clone = document.getElementById('cars').cloneNode(true); 
 
    clone.removeAttribute('id'); 
 
    container.appendChild(clone); 
 
}; 
 
document.getElementById('add').addEventListener('click', onAddClick);

<div id="container"> 
 
    <select name="cars[]" id="cars"> 
 
    <option value="volvo">Volvo</option> 
 
    <option value="saab">Saab</option> 
 
    <option value="mercedes">Mercedes</option> 
 
    <option value="audi">Audi</option> 
 
    </select> 
 
</div> 
 
<button type="button" id="add">Add</button>