javascript for loop在html div中打印多行_Javascript_Html

javascript for loop在html div中打印多行

javascript html

javascript for loop在html div中打印多行,javascript,html,Javascript,Html,我已经看到了一堆非常接近的例子，但是没有一个是正确的我正在构建一个HTA表单程序，人们可以在其中输入多行类似数据（例如邮件地址）。用户将输入的行数由接收数字的输入框决定： <html> <head> <title>Data Entry Application</title> <hta:application id = "ExampleHTA" singleInstance = "yes" icon = "macexp.i

我已经看到了一堆非常接近的例子，但是没有一个是正确的

我正在构建一个HTA表单程序，人们可以在其中输入多行类似数据（例如邮件地址）。用户将输入的行数由接收数字的

输入框决定：
<html>
  <head>
    <title>Data Entry Application</title>
    <hta:application id = "ExampleHTA" singleInstance = "yes" icon = "macexp.ico" border = "thin" minimizeButton = "no" maximizeButton = "no" scroll = "yes" />

    <script language="javascript" type="text/javascript">
      function numOfLines(choice)
      {
        for(var i = 0; i < choice; ++i)
        {
          document.getElementById("addy_lines").innerHTML = "<br />Name: <input type='text' id='Name' size=50 maxlength=50 /> Address: <input type='text' id='Address' size=50 maxlength=50 /> City: <input type='text' id='City' size=15 maxlength=15 /> State: <input type='text id='State' size=2 maxlength=2 /> Zip Code: <input type='text' id='Zip' size=5 maxlength=5 />";
        }
      }
    </script>
  </head>
  <body>
    <form>
      Number of Address Lines: <input type="text" id="AddyLines" size=2 maxlength=2 onChange="numOfLines(this.value);">
      <div id="addy_lines"></div>
    </form>
  </body>
</html>


数据输入应用程序
函数numOfLines（选项）
{
对于（变量i=0；i名称：地址：城市：州：如何更改
document.getElementById("addy_lines").innerHTML = "<br />Name: <input type='text' id='Name' size=50 maxlength=50 /> Address: <input type='text' id='Address' size=50 maxlength=50 /> City: <input type='text' id='City' size=15 maxlength=15 /> State: <input type='text id='State' size=2 maxlength=2 /> Zip Code: <input type='text' id='Zip' size=5 maxlength=5 />";

document.getElementById（“addy_行”）.innerHTML=“
名称：地址：城市：州：邮政编码：”；

您应该附加更改，而不是替换它们。
您写道：
document.getElementById("addy_lines").innerHTML = "<br />Name: <input type='text' id='Name' size=50 maxlength=50 /> Address: <input type='text' id='Address' size=50 maxlength=50 /> City: <input type='text' id='City' size=15 maxlength=15 /> State: <input type='text id='State' size=2 maxlength=2 /> Zip Code: <input type='text' id='Zip' size=5 maxlength=5 />";

此外，我会给所有元素一个名称，并使用类而不是id来更好地使用jQuery来定位它们。但这取决于您。
就像Jurik提到的，您正在创建重复的id。使用类或增量。不太好，因为现在他有相同的id
s，并且它们应该是唯一的。此解决方案有效：document.getElementById（“addy_line”）.innerHTML+=…。我将研究如何为元素指定自己的名称。谢谢。）
document.getElementById("addy_lines").innerHTML = "<br />Name: <input type='text' id='Name' size=50 maxlength=50 /> Address: <input type='text' id='Address' size=50 maxlength=50 /> City: <input type='text' id='City' size=15 maxlength=15 /> State: <input type='text id='State' size=2 maxlength=2 /> Zip Code: <input type='text' id='Zip' size=5 maxlength=5 />";

document.getElementById("addy_lines").innerHTML+= '<br/>' +
     'Name: <input type="text" id="Name" size="50" maxlength="50" /> ' +
     'Address: <input type="text" id="Address" size="50" maxlength="50" /> ' +
     'City: <input type="text" id="City" size="15" maxlength="15" /> ' +
     'State: <input type="text" id="State" size="2" maxlength="2" /> ' +
     'Zip Code: <input type="text" id="Zip" size="5" maxlength="5" />';

document.getElementById("addy_lines").innerHTML+= '<br />' +
    'Name: <input type="text" id="Name-' + i + '" size="50" maxlength="50" /> ' +
    'Address: <input type="text" id="Address-' + i + '" size="50" maxlength="50" /> ' +
    'City: <input type="text" id="City-' + i + '" size="15" maxlength="15" /> ' +
    'State: <input type="text" id="State-' + i + '" size="2" maxlength="2" /> ' +
    'Zip Code: <input type="text" id="Zip-' + i + '" size="5" maxlength="5" />';