如何实现点击一按钮增加一个输入框？

Question

<input type=button onclick="add()" value="add">
<script>
function add(){
var o=document.createElement("INPUT");
o.type="text";
document.body.appendChild(o);
}
</script>

Answer 1

<input type=button onclick="add()" value="add">
<script>
function add()
{
document.body.innerHTML+=('<input type=text>');
}
</script>

Answer 2

那我多次点击的话怎么区分这么多的text呢？还有，假如我要想在每个text后面加一个删除按钮，点删除按钮怎么定位哪个text呢

Answer 3

<input type=button onclick="add()" value="add">
<script>
var i=1;
function add()
{
document.body.innerHTML+=('<input type=text id="txt'+i+'">');
document.body.innerHTML+=('<input type=button onclick="del(this)" value="删除" id="btn'+i+'">'+'<br>');
i++;
}
function del(obj)
{
  var o=document.getElementById('txt'+obj.id.replace(/[^\d]/g,''));
  o.removeNode(true);
  obj.removeNode(true);
}
</script>

Answer 4

这样的话，删除某一个后，他所占的位置会空下来，新增的也只是在最后面加入，如果想让它删除一行后，后面的提上来，又该怎么办呢？
    还有，当提交时（struts实现）,该怎么在actionForm里记录相应的属性呢，每个text用相同的name吗？

Answer 5

<input type="text" onclick="add()" value="add">
<script language="javascript">
function add()
{
var i=1;
var o=document.createElement("INPUT");
o.text="text";
o.id="'txt'+i+";
document.body.appendChild(o);
}
</script>

Answer 6

找到原因了，原来占的位子空出来是因为有个<br>未删除。但怎么将它和struts中ActionForm绑定还没弄清楚，这些文本框是动态生成的，在ActionForm中怎么对应呢？