Question

我正在尝试制作LED节能计算器（通过网页提供用户输入）。使用下面的代码，它成功输出现有的灯具＆＃39;每年的电力使用和这种电力使用的成本。但我无法弄清楚为什么它不会对提议的灯具做同样的事情。

如果有人能借给我一些线索，那就太棒了！谢谢！

（请注意，我发现并非所有声明的变量都在使用中。）

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>LED Savings Calculator</title>
</head>

<body>

<b>Electric utility rate</b>
<table border="1">
<tr>
    <td>Your electric utility rate ($/kWh):</td>
    <td><input id="elecRate" value="0.17" onchange="calculate();"></td>
</tr>
</table>

<br><br>

<b>Existing Lighting:</b>
<table border="1">
<tr>
    <td>Number of existing fixtures:</td>
    <td><input id="numExisting" onchange="calculate();"></td>
</tr>
<tr>
    <td>Watts per fixture (include watts of bulbs or tubes, plus watts of      ballast):</td>
    <td><input id="wattsExisting" onchange="calculate();"></td>
</tr>
<tr>
    <td>Cost of bulbs or tubes, per fixture:</td>
    <td><input id="priceExisting" onchange="calculate();"></td>
</tr>
<tr>
    <td>Lifespan of bulb or tube (rated hours):<br><br>
        (Typical incandescent: 1,000 - 2,000 hours.)</td>
    <td><input id="lifeExisting" onchange="calculate();"></td>
</tr>
<tr>
    <td>Hours lights are on per day (average per fixture):</td>
    <td><input id="hoursOn" onchange="calculate();"></td>
</tr>
<tr>
    <td>Days lights are on per week (average per fixture):</td>
    <td><input id="daysOn" onchange="calculate();"></td>
</tr>
<tr>
    <td>Total electric use per year (kWh):</td>
    <td><span id="kwhPerYearField"></span></td>
</tr>
<tr>
    <td>Total electric cost per year:</td>
    <td>$<span id="elecCostPerYearField"></span></td>
</tr>
</table>

<br><br>

<b>Proposed LED Lighting:</b>
<table border="1">
<tr>
    <td>Number of proposed LED fixtures:<br>(Note that often less LED  fixtures than existing fixtures are necessary to provide same lighting.)</td>
    <td><input id="numProposed" onchange="calculate();"></td>
</tr>
<tr>
    <td>Watts per proposed LED fixture:<br></td>
    <td><input id="wattsProposed" onchange="calculate();"></td>
</tr>
<tr>
    <td>Cost of upgrade per proposed LED fixture ($):</td>
    <td><input id="costPerProposed" onchange="calculate();"></td>
</tr>
<tr>
    <td>Lifespan (rated hours) per proposed LED bulb or tube:</td>
    <td><input id="lifeProposed" onchange="calculate();"></td>
</tr>
<tr>
    <td>Total electric use per year (kWh) (all proposed fixtures):</td>
    <td><span id="kwhPerYearProposedField"></span></td>
</tr>
<tr>
    <td>Total electric cost per year (all proposed fixtures):</td>
    <td>$<span id="elecCostPerYearProposedField"></span></td>
</tr>
</table>

<script language="JavaScript">
function calculate(){
    <!-- Existing lighting: -->
    var numExisting = document.getElementById("numExisting").value;
    var wattsExisting = document.getElementById("wattsExisting").value;
    var priceExisting = document.getElementById("priceExisting").value;
    var lifeExisting = document.getElementById("lifeExisting").value;
    var elecRate = document.getElementById("elecRate").value;
    var hoursOn = document.getElementById("hoursOn").value;
    var daysOn = document.getElementById("daysOn").value;

    var kwhPerYearField = document.getElementById("kwhPerYearField");
    var elecCostPerYearField = document.getElementById("elecCostPerYearField");
    var kwhPerYear = (numExisting*wattsExisting*hoursOn*daysOn*52)/1000;
    kwhPerYearField.innerHTML = kwhPerYear.toString();
    elecCostPerYearField.innerHTML = (kwhPerYear*elecRate).toFixed(2);


    <!-- Proposed lighting: -->
    var numProposed = document.getElementById("numProposed").value;
    var wattsProposed = document.getElementById("wattsProposed").value;
    var costPerProposed = document.getElementById("costPerProposed").value;
    var lifeProposed = document.getElementById("lifeProposed").value;

    var kwhPerYearProposed = (numProposed*wattsProposed*hoursOn*daysOn*52)/1000;
    var kwhPerYearProposedField = document.getelementbyid("kwhPerYearProposedField");
    kwhPerYearProposedField.innerHTML = kwhPerYearProposed.toString();

    var elecCostPerYearProposedField = document.getElementById("elecCostPerYearProposedField");
    elecCostPerYearProposedField.innerHTML = (kwhPerYearProposed*elecRate).toFixed(2);
}
</script>

</body>
</html>

Answer 1

未捕获的TypeError：document.getelementbyid不是函数

更改为getElementbyId。 JavaScript是敏感。

var kwhPerYearProposedField = document.getelementbyid("kwhPerYearProposedField");
//                                     ^

Javascript：无法获得用户输入生成的数学产品以输出

1 个答案: