Question

我想根据用户输入动态生成文本框。如果用户在文本框中输入整数值，如果他/她输入5我想生成5个文本框。此代码在Firefox中有效，但在IE和Netscape中无效;请帮助我如何做到这一点或指出这个代码中的任何其他错误给我。此外，我们使用的技术是Struts 2.
请帮帮我。

JavaScript代码：

function generate()
{
  var tot = document.getElementById("totmob").value;
  var tbl = document.getElementById("sim");

for(var i =1;i<=tot;i++)
{
  tbl.innerHTML  = 'Mobile No'+i+' <input type="text"  size = "20" maxlength= "20" name= hoardingregister.mobileno> <br> \n';
}

HTML code：

<td>
<s:textfield id="totmob" label="Total Mobile Number"  />
<td>
<td>
<input type="button"  value="ADD" onclick="generate()"/>
</td>
</tr>
</table>
<div id="sim">
</div>

Answer 1

for(var i =1;i<=tot;i++)
{
  tbl.innerHTML  = 'Mobile No'+i+' <input type="text"  size = "20" maxlength= "20" name= hoardingregister.mobileno> <br> \n';
}

应该是

for(var i =1;i<=tot;i++)
{
  tbl.innerHTML  += 'Mobile No'+i+' <input type="text"  size = "20" maxlength= "20" name= hoardingregister.mobileno> <br> \n';
}

因为您需要附加到内部HTML，而不是替换它。

您还使用了＆lt; td＆gt;而不是＆lt; / td＆gt;

Answer 2

你可以尝试除InnerHtml以外的其他东西 - 你可以试试这个：

使用GetElementByID获取要添加文本框的元素
删除所有现有子项目（如果需要）
将文本框作为子项添加到所选节点

Answer 3

从您的javascript代码看，您应该使用以下代码：

tbl.innerHTML  +=

而不是

tbl.innerHTML  =

在for循环中

。

Answer 4

以下代码在IE和Firefox中都非常适合我。当你说它不工作时，你的意思是什么？

function generate()
{
  var tot = document.getElementById("totmob").value;
var tbl = document.getElementById("sim");

for(var i =1;i<=tot;i++)
{
  tbl.innerHTML  = tbl.innerHTML  +'Mobile No'+i+' <input type="text"  size = "20" maxlength= "20" name= hoardingregister.mobileno> <br> \n';
}

}
</script>
<body>
<table>
<tr>
    <td>
        <span>Total Mobile Number  </span>
        <input type="text" id="totmob" />
    <td>
    <td>
    <input type="button"  value="ADD" onclick="generate()"/>
    </td>
</tr>
</table>
<div id="sim">
</div>
</body>
</html>

Answer 5

为输入名称添加唯一标识符或为其添加唯一ID。

像：

for(var i =1;i<=tot;i++)
{
  tbl.innerHTML  += 'Mobile No'+i+' <input type="text"  size = "20" maxlength= "20" name= hoardingregister.mobileno'+i+'> <br> \n';
}

或者你把一个id放进去：

ID = “输入” + I

Answer 6

但是，如果要更改文本框中的值而不刷新页面，则在先前添加的文本框之后会添加更多文本框。但是每当我们更改文本框中的值时，只应添加新文本框的tat数而不是保留以前的文本框，这是错误的。你能否根据我说的条件改变编码。

使用JavaScript动态生成文本框

6 个答案: