计算器未捕获的类型错误无法将属性“值”设置为 null
2020-09-22
66
输入了一个建筑计算器，但由于某种原因，它无法识别计算末尾的对象。尝试移动该函数以查看在尝试从该函数中提取时是否顺序错误，并且还删除了 Number5 和所有相关行，但错误出现了，Number4 是问题所在，这让我相信问题出在关闭上。
function Calculate(n1, n2, n3, n4, n5, n6, n7) {
var total;
var buildRate
switch (n1) {
case "Double Brick":
buildRate = 1290 * n2;
break;
case "Brick Veneer":
buildRate = 1160 * n2;
break;
case "Weather Board":
buildRate = 950 * n2;
break;
case "Other":
buildRate = 900 * n2;
break;
default:
break;
}
total = buildRate + (n3 * 1) + (n4 * 1) + (n5 * 1) + (n6 * 1) + (n7 * 1);
return total;
}<table>
<tr>
<td><label for="Construction">CONSTRUCTION TYPE:</label>
</td>
<td><select name="Construction" id="Construction">
<option value="Double Brick">Double Brick</option>
<option value="Brick Veneer">Brick Veneer</option>
<option value="Weather Board">Weather Board</option>
<option value="Other">Other</option>
</select></td>
</tr>
<tr>
<td>AREA OF HOME [SQ METRES]:
</td>
<td> <input type="number" name="Area" id="Area" /></td>
</tr>
<tr>
<td>GARAGE, DRIVEWAYS:
</td>
<td>$<input type="number" name="Number1" id="Number1" /></td>
</tr>
<tr>
<td>FENCES, GATES:
</td>
<td>$<input type="number" name="Number2" id="Number2" /></td>
</tr>
<tr>
<td>INGROUND SWIMMING POOL:
</td>
<td>$<input type="number" name="Number3" id="Number3" /></td>
</tr>
<tr>
<td>ARCHITECTS FEES, DEBRIS REMOVAL:
</td>
<td>$<input type="number" name="Number4" id="Number4" /></td>
</tr>
<tr>
<td>PERMANENT FIXTURES - SHEDS AIR CONDITIONING UNIS:
</td>
<td>$<input type="number" name="Number5" id="Number5" /></td>
</tr>
<tr>
<td>COST OF CONSTRUCTION: </td>
<td>$<input type="number" name="Cost"/></td>
</tr>
</table>
<input type="button" value="Calculate" onclick="document.getElementById('Cost').value =
Calculate(document.getElementById('Construction').value,
document.getElementById('Area').value,
document.getElementById('Number1').value,
document.getElementById('Number2').value,
document.getElementById('Number3').value,
document.getElementById('Number4').value,
document.getElementById('Number5').value)" />
<input type="reset" value=" Clear " onclick="location.reload();" />3个回答
您错过了 id：
<input type="number" name="Cost"/>
为了使用
document.getElementById('Cost').value
获取其值，您必须添加 id 属性：
<input type="number" name="Cost" id="Cost" />
Alessandro
2020-09-22
已解决
不需要 Cost.value 的 getElement 部分。
<input type="button" value="Calculate" onclick= "Cost.value =
Tim
2020-09-22
您忘记在成本输入中添加 id，您也可以像我一样在 js 函数中获取值
function Calculate() {
n1 = document.getElementById('Construction').value;
n2 = document.getElementById('Area').value;
n3 = document.getElementById('Number1').value;
n4 = document.getElementById('Number2').value;
n5 = document.getElementById('Number3').value;
n6 = document.getElementById('Number4').value;
n7 = document.getElementById('Number5').value;
var total;
var buildRate
switch (n1) {
case "Double Brick":
buildRate = 1290 * n2;
break;
case "Brick Veneer":
buildRate = 1160 * n2;
break;
case "Weather Board":
buildRate = 950 * n2;
break;
case "Other":
buildRate = 900 * n2;
break;
default:
break;
}
total = buildRate + (n3 * 1) + (n4 * 1) + (n5 * 1) + (n6 * 1) + (n7 * 1);
return total;
}<table>
<tr>
<td><label for="Construction">CONSTRUCTION TYPE:</label>
</td>
<td>
<select name="Construction" id="Construction">
<option value="Double Brick">Double Brick</option>
<option value="Brick Veneer">Brick Veneer</option>
<option value="Weather Board">Weather Board</option>
<option value="Other">Other</option>
</select>
</td>
</tr>
<tr>
<td>AREA OF HOME [SQ METRES]:
</td>
<td> <input type="number" name="Area" id="Area" /></td>
</tr>
<tr>
<td>GARAGE, DRIVEWAYS:
</td>
<td>$<input type="number" name="Number1" id="Number1" /></td>
</tr>
<tr>
<td>FENCES, GATES:
</td>
<td>$<input type="number" name="Number2" id="Number2" /></td>
</tr>
<tr>
<td>INGROUND SWIMMING POOL:
</td>
<td>$<input type="number" name="Number3" id="Number3" /></td>
</tr>
<tr>
<td>ARCHITECTS FEES, DEBRIS REMOVAL:
</td>
<td>$<input type="number" name="Number4" id="Number4" /></td>
</tr>
<tr>
<td>PERMANENT FIXTURES - SHEDS AIR CONDITIONING UNIS:
</td>
<td>$<input type="number" name="Number5" id="Number5" /></td>
</tr>
<tr>
<td>COST OF CONSTRUCTION: </td>
<td>$<input type="number" name="Cost" id="Cost" /></td>
</tr>
</table>
<input type="button" value="Calculate" onclick="document.getElementById('Cost').value = Calculate() " />
<input type="reset" value=" Clear " onclick="location.reload();" />Abdul Moiz
2020-09-22