根据用户输入显示最多 12 个时间表

1 阅读 0 评论 0 点赞

当我控制台时，它似乎认为 ttinput 是一个字符串。记录它说“”的变量。所有其他似乎都有效我只是不知道如何将 ttinput 作为数字。

document.getElementById("enter").addEventListener("click", ttcalc)
var ttinput = document.getElementById("table").value;
var ttoutput;


function ttcalc(){

        var display = "";

        for(var i = 1; i <= 12; i++){

            ttoutput = ttinput * i;
            display += ttinput + "*" + i + "=" + ttoutput + "<br>"
            console.log(ttoutput, ttinput, i);

        }

    document.getElementById("output").innerHTML = display;

}

这是我的 html

    <form>
            <h1>Enter what times table you wish to see</h1>
            <input type="number" id="table"><br>
        </form>

        <button id="enter">Show Times Table</button>
    </div>

问题是

var ttinput = document.getElementById("table").value;

在页面加载时读取（当输入字段为空时）。如果您将那行代码移到您的函数中，它将在单击按钮后读取输入字段的值。

如果您想确定输入的值是一个数字，您可以使用该函数，然后使用如下函数parseInt()检查结果是否是一个数字：isNaN()

var ttinput = parseInt(document.getElementById("table").value);

然后使用isNaN()：

if( !isNaN(ttinput) ) {
    // ttinput is a number
} else {
    // ttinput is not a number
}

更多信息：parseInt和isNaN。

检查下面的例子：

document.getElementById("enter").addEventListener("click", ttcalc)

function ttcalc() {
  var ttinput = parseInt(document.getElementById("table").value);
  var ttoutput;
  var display = "";

  if( !isNaN(ttinput) ) {
    for(var i = 1; i <= 12; i++) {
      ttoutput = ttinput * i;
      display += ttinput + "*" + i + "=" + ttoutput + "<br>"
      console.log(ttoutput, ttinput, i);
    }
    document.getElementById("output").innerHTML = display;
  } else {
    console.log("value is not a number");
  }
}

<button id="enter">Enter</button>
<input type="text" id="table" value="">
<div id="output"></div>

展开片段

如果确定它是数字，请在要将值转换为数字的位置写入 +ttinput

写在哪里对不起？

这回答了你的问题了吗？如何从输入字段中获取数字值？

您在页面加载之前获取值，因此它始终为空。在函数中获取“表”的值ttcalc。

非常感谢 Heretic Monkey！