Question

我正在尝试调试我写的一些javascript，无法弄清楚为什么它不起作用。如果我对变量进行硬编码就可以正常工作，但是如果我使用document.getElementById（'id'）。value来获取它失败的变量。

下面的示例运行正常，但是一旦我取消注释评论的行，它就不会。在第二部分之前和之后打印变量它们看起来是相同的。

真的不知道发生了什么。也许我只需要睡在上面，但如果有人得到的建议会很棒！

roof_width = 5;
roof_depth = 3;
panel_width = 2;
panel_depth = 1;
panel_power = 200;
roof_margin = 0.100;
panel_gap = 0.05;

roof_width = document.getElementById('roof_width').value;
roof_depth = document.getElementById('roof_depth').value;
// panel_width = document.getElementById('panel_width').value;
// panel_depth = document.getElementById('panel_depth').value;
panel_power = document.getElementById('panel_power').value;
// roof_margin = document.getElementById('roof_margin').value;
panel_gap = document.getElementById('panel_gap').value;

Answer 1

您是否尝试添加文本框中的数字？由于JavaScript的变量类型系统的工作方式（与+运算符的重载相结合），2 + 2 === 4（添加数字）但'2' + '2' === '22'（字符串连接）。尝试将行更改为，例如：

panel_width = parseFloat(document.getElementById('panel_width').value);

或者：

panel_width = Number(document.getElementById('panel_width').value);

这将确保JavaScript将数字视为数字而不是字符串。

Answer 2

无法以与调用HTML元素相同的方式调用JavaScript参数。为了打电话

document.getElementById('roof_margin').value;

您需要将'roof_margin'指定给HTML表单元素。

Answer 3

也许你有多个具有相同ID的dom元素？请记住，dom元素ID必须是唯一的。我建议你使用jquery与html交互javascript。

Answer 4

确保您的代码处于onload函数中。否则，元素可能尚未加载到DOM中。

window.onload = funciton(){/* code here */};

Javascript调试 - 脚本使用硬编码变量，而不是getElementById（'id'）。value

4 个答案: