使用按鈕和html的Javascript新輸入字段

Question

我已經創建了這部分代碼。無論何時按下按鈕，都會在表單中添加新的輸入論壇字段。如何每次在字段旁添加文本和數字（從3開始）？ 例如：選項1：輸入類型字段 選項2：輸入類型字段 選項3：輸入類型字段 等

<SCRIPT language="javascript"> function add() { 
//Create an input type dynamically. 
var element = document.createElement("input"); 

//Assign different attributes to the element. 
element.setAttribute("type", 'text'); 
element.setAttribute("value", ''); 
element.setAttribute("name", 'text[]'); 


var foo = document.getElementById("fooBar"); 
//Append the element in page (in span). 
foo.appendChild(element); 

} 
</SCRIPT> 

上面的代碼部分正在使用由下述（僅供參考）：

<b>Option 1:</b> <input type="text" name="text[]" /><br /> 
<b>Option 2:</b> <input type="text" name="text[]" /> 
<input type="button" value="Add Option" onclick="add()"/> 
<span id="fooBar"></span> 

在此先感謝！ :)

Answer 1

var temp = 3; 

function add() { 
var element = document.createElement("input"); 
var span = document.createElement("span"); 
    span.innerHTML = "Option "+temp; 
//Assign different attributes to the element. 
element.setAttribute("type", 'text'); 
element.setAttribute("value", ''); 
element.setAttribute("name", 'text[]'); 


var foo = document.getElementById("fooBar"); 

    foo.appendChild(span); 
    foo.appendChild(element); 

temp++; 
} 

Answer 2

var optionCount = 3; 
 

 
function add() { 
 
    //Create an input type dynamically. 
 
    var element = document.createElement("input"); 
 
    var label = document.createElement("label"); 
 
    label.innerHTML = "Option " + optionCount++ +":" 
 
    //Assign different attributes to the element. 
 
    element.setAttribute("type", 'text'); 
 
    element.setAttribute("value", ''); 
 
    element.setAttribute("name", 'text[]'); 
 

 

 
    var foo = document.getElementById("fooBar"); 
 
    //Append the element in page (in span). 
 
    foo.appendChild(label); 
 
    foo.appendChild(element); 
 

 
}

<b>Option 1:</b> 
 
<input type="text" name="text[]" /> 
 
<br /> 
 
<b>Option 2:</b> 
 
<input type="text" name="text[]" /> 
 
<input type="button" value="Add Option" onclick="add()" /> 
 
<span id="fooBar"></span>