IE7毛刺與appendChild（）的輸入框

Question

我正在使用下面的JavaScript來添加基於數字在下拉菜單中的一些輸入。它在firefox和chrome中可以正常工作，但在IE7中，所有輸入均浮動在新行上。

function add(number) 
{ 
var foo = document.getElementById("listInputs2"); 
var count = 1; 
foo.innerHTML = ""; 

while (count <= (number)) 
{ 
//Create an input type dynamically. 
var element = document.createElement("input"); 

//Assign different attributes to the element. 
element.setAttribute("name", "value"+count); 
element.setAttribute("id", "value"+count); 
element.setAttribute("size", "60"); 
element.setAttribute("type", "text"); 
element.setAttribute("value", ""); 

//Append the element in page (in span). 
foo.innerHTML+=('<li class="inputCount"><label for="value'+count+'">#'+count+'</label>'); 
foo.appendChild(element); 
foo.innerHTML+=("</li>"); 
count += 1; 
} 

} 

Answer 1

我在Firefox中得到同樣的錯誤：您將輸入添加爲listInput2的子項，而不是li。

下面是一段代碼，工程：

function add(number) 
{ 
var foo = document.getElementById("listInputs2"); 
var count = 1; 
foo.innerHTML = ""; 

while (count <= (number)) 
{ 
//Create an input type dynamically. 
var input = "<input name='value"+count+"' id='value"+count+"' size='60' type='text' value=''>"; 

//Append the element in page (in span). 
foo.innerHTML+='<li class="inputCount"><label for="value'+count+'">#'+count+'</label>'+input+'</li>'; 
count += 1; 
} 

}