这是一个体重指数计算器。我希望首先检查数据验证。文本字段不能为空。然后计算BMI并显示到另一个文本框中。验证部分工作正常,但计算函数不工作。请帮我找出错误。
function validate() {
if (document.myForm.weight.value == "") {
alert("Please provide your weight!");
document.myForm.weight.focus();
return false;
}
if (document.myForm.height.value == "") {
alert("Please provide your heught!");
document.myForm.height.focus();
return false;
}
calBMI();
}
function calBMI() {
var weight = getElementById("weight").value;
var height = getElementById("height").value;
var bmi = weight / (height * height);
document.getElementById("bmi").innerHTML = bmi;
}<body>
<form name="myForm">
<label>weight</label>
<input type="text" name="weight" id="weight">
<label>height</label>
<input type="text" name="height" id="height">
<input type="text" readonly="readonly" id="bmi">
<input type="submit" value="Submit" onclick="validate() calBMI()">
</form>
</body>
发布于 2021-11-15 15:25:10
function validate() {
var height = document.getElementById("height").value;
var weight = document.getElementById("weight").value;
if (height == "" || height == 0) {
document.getElementById("result").innerHTML = "Please enter a valid height";
return;
}
if (weight == "" || weight == 0) {
document.getElementById("result").innerHTML = "Please enter a valid weight";
return;
}
calBMI();
}
function calBMI() {
var weight = document.getElementById("weight").value;
var height = document.getElementById("height").value;
var bmi = weight / (height * height);
document.getElementById("result").innerHTML = `BMI: ${bmi}`;
}<!DOCTYPE html>
<html lang="en">
<head>
</head>
<body>
<div>Weight</div>
<input type="number" id="weight">
<div>Height</div>
<input type="number" id="height">
<input type="submit" value="Submit" onclick="validate()">
<div id="result"></div>
</body>
</html>
发布于 2021-11-15 15:22:02
添加适当的函数来计算bmi。不需要在提交时调用calculatebmi。
var form = document.getElementsByName('myForm')[0];
form.addEventListener('submit', validate);
function validate(e) {
e.preventDefault();
if (document.myForm.weight.value == "") {
alert("Please provide your weight!");
document.myForm.weight.focus();
return false;
}
if (document.myForm.height.value == "") {
alert("Please provide your heught!");
document.myForm.height.focus();
return false;
}
var weight = document.myForm.weight.value;
var height = document.myForm.height.value;
calBMI(weight, height);
return true;
}
function calBMI(w, h) {
var bmi = Math.ceil((w / Math.pow(h, 2)) * 703);
document.getElementById("bmi").setAttribute('value', bmi);
}<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
</head>
<body>
<form name="myForm">
<label>weight</label>
<input type="text" name="weight" id="weight">
<label>height</label>
<input type="text" name="height" id="height">
<input type="text" readonly="readonly" id="bmi">
<input type="submit" value="Submit" onclick="validate();">
</form>
</body>
</html>
https://stackoverflow.com/questions/69976309
复制相似问题