我正在制作一个超级简单的BMI计算器,您可能会说我是Java的新手。到目前为止,这就是我的HTML和Javascript文件中的内容。我在这里想知道答案的地方是什么?我知道问题出在Javascript的某个地方。我想念一些东西。谢谢你。
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>BMI Calculator</title>
</head>
<body>
<h1> BMI Calculator</h1>
<form action="" method="get" id="bmi-form">
<div class=section">
<label for="q">Enter Weight in Pounds</label>
<input type="search" id="weight" name="weight" required placeholder="type your weight">
</br>
<label for="h">Enter your Height in Inches</label>
<input type="search" id="height" name="height" required placeholder="type your height">
</div>
<div class="button-group">
<button type="submit" id="btn">Check</button>
</div>
</form>
<div id="output"></div>
<script src="javascript1.js"></script>
</body>
JS:
(function() {
var btn = document.getElementById("btn"),
bmiForm =document.getElementById("bmi-form"),
weight = document.getElementById("weight"),
height = document.getElementById("height");
btn.onclick = function calcBMI() {
var bmi = weight*703/(height*height);
alert('the answer' + bmi);
};
})();
这里的问题是权重和高度是dom元素引用,而不是它们的值,要获取它们的值,您需要阅读value属性
所以
(function() {
var btn = document.getElementById('btn'),
bmiForm = document.getElementById('bmi-form'),
weight = document.getElementById('weight'),
height = document.getElementById('height');
btn.onclick = function(e) {
var bmi = weight.value / (height.value * height.value)
alert(bmi);
//to prevent the form submission
e.preventDefault();
}
})();
<form id="bmi-form">
<input id="weight" />
<input id="height" />
<button type="submit" id="btn">Test</button>
</form>
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句