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

スクリプトに 2 つのエラーがあります。まず、設定時に

window.onload = pipeheater();

pipeheaterすぐに呼び出され、起動されるのを待っていないwindow.onloadため、まだ存在しない要素の値を読み取ろうとするとエラーが発生します。これは次のように修正できます。

window.onload = pipeheater;

次に、数値である を使用しようとしinnerHTMLます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」を 1 つのスクリプトで 2 回使用できないことに注意してください。これは、相互に優先し、変数の結果が得られないためです。

于 2013-07-22T10:59:24.860 に答える