我不明白为什么这个功能不起作用。赋值指令要求 javascript 函数代码位于其自己的 javascript 文件中。
这是 html
<h2>BMI Calculator</h2>
<form>
<input type="text" id="weight" value="0" />
<label for="weight">Weight in pounds</label>
<input type="text" id="height" value="0" />
<label for="height">Height in inches</label>
<input type="text" id="Result" value="0" />
<label for="Result"> BMI Result </label>
<input type="submit" id="submit" value="Calculate BMI" />
</form>
这是基于该形式的函数。它应该计算bmi。
function calcBMI() {
var weight = parseInt(document.getElementByID("weight").value);
var height = parseInt(document.getElementByID("height").value);
var result = (weight * 703) / (height * height);
var textbox = document.getElementById('Result').value;
textbox.value = result;
}
document.getElementById("submit").addEventListener("click", calcBMI, false);
最佳答案
三件事:
getElementById
必须采用驼峰式大小写。末尾不带大写 D对文本框的引用应该只是
var textbox = document.getElementById('Result')
,而不是在末尾加上.value
。按钮的类型应为
button
,否则将发布表单。
您的工作示例:
function calcBMI() {
var weight = parseInt(document.getElementById("weight").value);
var height = parseInt(document.getElementById("height").value);
var result = (weight * 703) / (height * height);
var textbox = document.getElementById('Result');
textbox.value = result;
}
document.getElementById("submit").addEventListener("click", calcBMI, false);
<h2>BMI Calculator</h2>
<form>
<input type="text" id="weight" value="0" />
<label for="weight">Weight in pounds</label>
<input type="text" id="height" value="0" />
<label for="height">Height in inches</label>
<input type="text" id="Result" value="0" />
<label for="Result"> BMI Result </label>
<input type="button" id="submit" value="Calculate BMI" />
</form>
关于Javascript 按钮无法与功能一起使用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46181366/