0

我希望加热答案出现在加热表面 (mm) 旁边，但我无法让它工作。我只从 chrome 控制台收到以下错误消息

Uncaught TypeError: Cannot read property 'value' of null

我知道其他一切都有效，因为我添加了一个警告框，但我需要 innerHTML 才能工作。

这是html：

 <html>

<head>
<script type="text/javascript" src="pipeheaterfunction.js">
</script>
</head>

<body>

<table>
<tr><td>Inner Diameter (mm):</td>
<td><input id="dia" onkeypress="pipeheater();"></td>

<tr><td>Pipe Thickness (mm):</td>
<td><input id="thi" onkeypress="pipeheater();"></td>

<tr><th>Calculate heater:</th>
<td><button onclick="pipeheater();">Calculate</button></td></tr>

<tr><td>Heating Surface(mm):</td>
<td><span class="output" id="surface"></span></td></tr>
</table>

</body>


</html>

这是javascript代码：

function pipeheater(){ //dia is the inner diameter of a pipe, thi is the pipe thickness

var dia = document.getElementById("dia").value;
var thi = document.getElementById("thi").value;
var hsur; //hsur is the heating surface required for a certain pipe in mm

hsur = 5*Math.sqrt(((dia-thi)*thi)/2);

var surface = hsur;


if(surface>0){
surface.innerHTML=surface.toFixed(1);
alert(surface.toFixed(1));
}


}

window.onload=pipeheater();
4

2 回答 2

2

您的脚本中有两个错误。起初，当设置

window.onload = pipeheater();

pipeheater立即调用，它不会等待window.onload被触发，并且在尝试读取尚未存在的元素的值时会出现错误。你可以像这样解决这个问题：

window.onload = pipeheater;

其次，您尝试使用innerHTMLof hsur，它是一个数字。您需要为实际的 HTML 元素定义一个变量。以下是您的固定代码。

function pipeheater() {
    var dia = document.getElementById("dia").value,
        thi = document.getElementById("thi").value,
        hsur = 5 * Math.sqrt(((dia - thi) * thi) / 2),
        surface = document.getElementById("surface");

    if (hsur > 0) {
        surface.innerHTML = hsur.toFixed(1);
        alert(hsur.toFixed(1));
    }
}

window.onload = pipeheater;

您可以在jsFiddle检查它是如何工作的。我建议您在使用它们进行任何计算之前验证它们dia的值。thi也使用onchange代替onkeypress可能对用户来说更舒服，并且会给你更可靠的结果。

于 2013-07-22T11:52:00.040 回答
0

您忘记定义“表面”。

var surfaceSPAN = document.getElementById("surface");

然后你可以这样做：

surfaceSPAN.innerHTML = surface.toFixed(1);

请注意，您不能在一个脚本中两次使用变量名称“surface”，因为它们会相互否决并且您将没有变量结果。

于 2013-07-22T10:59:24.860 回答