点按钮在 javascript 计算器中不起作用

Question

我正在制作这个计算器应用程序，一切正常，我几乎完成了，但是当我点击它时屏幕上的点按钮有问题，它在控制台中给了我这个错误：

The specified value "." is not a valid number. The value must match to the following regular expression: -?(\d+|\d+\.\d+|\.\d+)([eE][-+]?\d+)?

这是代码：

<input type="number" placeholder="Enter A Number...." step="0.01">

<td><button id="dot">.</button></td>

---

dot.addEventListener("click", function() {
    input.value += this.textContent;
    re1 = input.value;
})

我还添加了这段代码以防止输入中出现任何特殊字符：

input.onkeypress = function(e) {
var chr = String.fromCharCode(e.which);
if ("1234567890qwertyuioplkjhgfdsazxcvbnmQWERTYUIOPLKJHGFDSAZXCVBNM.".indexOf(chr) < 0)
    return false;
};

但如果我把它注释掉，什么也不会发生，所以我不知道问题出在哪里。

任何帮助将不胜感激并提前致谢。

编辑：这是一个带有应用程序的代码笔，因此您可以自己查看问题

Answer 1

将类型更改为text而不是number

<input type="text" placeholder="Enter A Number....">

添加点时. 对于您的输入，它不再是数字，因此type="number"会引发错误。

type="number"的输入元素实际上是一个字符串字段，然后在内部传递时转换为数字