尝试使用 javascript 生成更多具有唯一名称的文件上传字段答案

【问题标题】：trying to generate more file upload fields with unique names using javascript尝试使用 javascript 生成更多具有唯一名称的文件上传字段
【发布时间】：2011-08-09 07:37:38
【问题描述】：

我设法创建了一个添加文件上传字段的按钮、一个删除文件上传字段的按钮以及一个跟踪文件上传字段总数的计数器。问题是这些字段似乎没有唯一的名称。这些字段应该具有名称 img1、img2、img3 等...我可以看到它不起作用，因为文件没有上传到 SQL 表。

这是我的 javascript 和 HTML：

<script type="text/javascript">
var counter = 0;
function init(){
document.getElementById("counter").value=counter;
}
function add(){
counter++;
if (counter > 10){counter = 10;
}
else{
document.getElementById("counter").value=counter;
document.getElementById("addimg").innerHTML+="<input type='file' name='img'+counter>"+"<br>";}
}
function remove(){
counter--;
if (counter <= 0){counter = 0;}
document.getElementById("counter").value=counter;
document.getElementById("addimg").innerHTML="";
for (var i=1;i<=counter;i++)
{
document.getElementById("addimg").innerHTML+="<input type='file' name='img'+i>"+"<br>";
}
}
</script>


<body onLoad = "init()">
<button onClick="add()" >Add Photo</button>
<button onClick="remove()" >Remove a Photo</button><br>
<form method="POST" enctype='multipart/form-data'>
<div id="addimg">
</div>
<input type="text" id="counter" name="counter" value="">
<input type="submit" name="submit" value="submit">
</form>


</body>

【问题讨论】：

标签： javascript html dom form-fields

【解决方案1】：

看到这一行：

document.getElementById("addimg").innerHTML+=
   "<input type='file' name='img'+counter>"+"<br>";}

counter 不会是 name

的一部分

使用

document.getElementById("addimg").innerHTML+=
    "<input type='file' name='img"+counter+"' /> <br/>";}

这一行同样的失误：

document.getElementById("addimg").innerHTML+="<input type='file' name='img'+i>"+"<br>";

【讨论】：

输入标签不应该有一个直角右括号吗？