为什么我的函数没有在前端显示我使用 for 循环创建的表？

问题描述 投票：0回答：1

我正在尝试创建一个函数，返回用户通过表单提交的给定数字的 12 倍表。用户通过输入框输入数字，然后单击次数按钮。然后列出该数字的 12 乘法表。我无法将函数中的数组输出到前端页面。

<script>
    function timestable(x){
        let x = Number(document.userNum.Number.value);
        let table = [];
        for(i=0; i++; i<13){
            value = x * i;
            table.push(value);
        }
        return table;
    };
</script>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <form name="userNum">
        Number: <input type="text" name="number1"> 
        <button onclick="timestable()">Times</button>
    </form>
</body>
</html>
javascript html frontend
1个回答
0
投票

有几个问题：

  • 您在 timestable 函数中将 x 作为参数传递，但也 在同一个函数中重新定义它
  • for循环应该这样写 
    for (i = 0; i++; i < 13)
  • 您在函数中使用 document.userNum.Number.value 但在您的 html 是 document.userNum.number1.value 元素
  • 提交表单时默认页面会刷新，您可以 使用 event.preventDefault() 防止这种行为；在时间表里 功能

如果你想显示结果（我猜你会这么做），你应该将结果放回 HTML 元素中，如下所示；

添加到时间表（）：

// Output the times table to the page
        let resultDiv = document.getElementById("result");
        resultDiv.innerHTML = table.join("<br>");

添加到 HTML 

<!-- Div to display the times table result -->
<div id="result"></div>
最新问题
© www.soinside.com 2019 - 2024. All rights reserved.