Question

我在使代码工作时遇到了一些麻烦。这是我到目前为止所做的。

function outputNamesAndTotal() {
  var name;
  var outputTable;
  var inputForm;
  var nameArray;
  var outputDiv;

  outputDiv = document.getElementById("outputDiv");
  inputForm = document.getElementById("inputForm");
  outputTable = document.getElementById("outputTable");
  name = inputForm.name.value;
  nameArray = [];

  nameArray.push(name);


  for (var i = 0; i > nameArray.length; i++) {

    outputTable.innerHTML += "<tr>" + nameArray[i] + "</tr>";

  }    

  inputForm.name.focus();
  inputForm.name.select();


  return false;

}

当我添加循环时，它完全破坏了代码，但我无法弄清楚原因。

我要做的是使用HTML表单从用户那里获取名称。用户输入名称后，程序会将名称添加到数组中，并将每个数组条目输出到表中的一行。

这是非常基本的，但它仍然给我带来各种麻烦！

Answer 1

for (var i = 0; i > nameArray.length; i++) {

我认为你的意思是i < nameArray.length

Answer 2

我想你每次调用这个函数都要清除你的名字数组。你应该带上一行：

nameArray = [];

将其全局化。

我进行了快速测试，以下代码至少在FireFox

中运行

编辑使用appendChild

<html>
<head>
<script type='text/javascript'>
var names = [];
function addName() {
    var nameTxt = document.getElementById('name_txt');
    var name = nameTxt.value;
    names.push(name);
    var outTable = document.getElementById('out_tbl');

    var row = document.createElement('tr');
    var entry = document.createElement('td');
    var txt = document.createTextNode(name);

    entry.appendChild(txt);
    row.appendChild(entry);
    outTable.appendChild(row);


    var numDiv = document.getElementById('num_div');
    removeAllChildren(numDiv);
    var numTxt = document.createTextNode('You have ' + names.length + ' names');
    numDiv.appendChild(numTxt);
}
function removeAllChildren(e) {
    while (e.hasChildNodes()) {
        e.removeChild(e.firstChild);
    }
}
</script>
</head>
<body>
    <table id='out_tbl'>
    </table>
    <div id='num_div'>You have 0 names</div>
    <input id='name_txt' type='text'/>
    <button onclick="addName()">CLICK</button>
</body>
</html>

编辑：哦，是的，你是每次都在循环数组的事实。如果你“全局化”名称数组，那么每次添加名称时都要打印整个数组。

编辑x2：您最初发布的代码将nameArray作为函数内的局部变量。每次调用该函数时，这都会有效地清除数组。然后，每次调用该函数时，都会将当前名称添加到现在为空的数组中，并遍历数组现在所有的1个（一个）元素。

您要做的是“全局化”名称数组，并从函数中删除循环。这将允许您跨多个调用构建名称数组，并按照您希望的方式工作。

此外，innerHTML并不是向页面添加内容的最佳方式。我建议使用appendChild（）。

-C

将名称添加到数组并将其输出到表

2 个答案: