显示按表单构建的数组的数组元素总数

Displaying total array elements for array being built by form

本文关键字：数组元素 数组 显示 表单 构建      更新时间：2023-09-26

我目前正在上一门JavaScript课程，要求我进行以下操作：

  1. 用户在表单中一次输入一个名称，然后按"提交"
  2. 名称存储在数组中并输出到表中
  3. 输入名称（并将其添加到表中）时，总数也必须更新 - 基于数组，而不仅仅是通过计数表元素

我目前的问题是我将添加一个名称，然后总数显示"1"--当我添加第二个名称时，总数显示"11"

这是我的 JavaScript 代码目前的样子：

function displayNamesAndTotal() {
// Your code goes in here.
var userInputName       = [];
var totalNamesEntered   = [];
var countTotal          = 0;
var firstName;
var arrayIndex;
var output;
var outputTotal;
var form;
form                = document.getElementById("userFormId");
output              = document.getElementById("userEntriesId");
outputTotal         = document.getElementById("testId");
//userInputName[0]  = form.firstname.value;
userInputName.push(form.firstname.value)
for (arrayIndex = 0; arrayIndex < userInputName.length; arrayIndex++) {
    output.innerHTML += "<tr><td>" + userInputName[arrayIndex] + "</td></tr>";
    countTotal += userInputName.length; 
}
outputTotal.innerHTML += countTotal;
return false;   
}

在过去的一天左右的时间里，我一直试图弄清楚我做错了什么 - 这可能是一件令人尴尬的事情 - 但我不知所措，可以使用指导。

有什么建议吗？

谢谢

看起来您的总数存储的是字符串而不是数字。尝试使用 parseInt（number） 将字符串转换为数字。

好悲伤，从阅读你们的其他答案中，我想我已经舔了

for (arrayIndex = 0; arrayIndex < userInputName.length; arrayIndex++) {    
    tableData = "<tr><td>" + userInputName[arrayIndex] + "</td></tr>";
    totalCount = userInputName.length;
}
output.innerHTML += tableData;
outputTotal.innerHTML = "<h4>Total Number of Strings: " + totalCount + "</h4>";
form.string.select();
return false;

这样，totalCount 在通过循环时充当数组的长度，然后在 innerHTML 语句的外部我可以显示它，并在提交新字符串时不断更新它。

感谢您的所有反馈

outputTotal.innerHTML是一个字符串，因此添加到它将字符串连接在一起。由于outputTotal.innerHTML开始时为空，因此将1添加到它创建"1"。当你再次添加 1 时，outputTotal.innterHTML 已经是 "1"，所以它变成了 "11"。

与其增加outputTotal.innerHTML，不如尝试直接将HTML设置为它。

outputTotal.innerHTML = countTotal;
相关文章：