JS条件不能按预期工作

JS条件不能按预期工作

问题描述:

不同性别的基础代谢率应该有不同的值。我的计算器显示男性是否选择男性或女性单选按钮的结果。JS条件不能按预期工作

男性BMR计算BMR = 66.5 +(13.75×体重kg)+(5.003×身高cm) - (6.755×年龄) BMR计算女性BMR = 655.1 +(9.563×体重kg )+(1.850×高厘米) - (4.676×年龄在年)

<!DOCTYPE html> 
 

 
<html> 
 

 
<head> 
 

 
<script> 
 

 
var bmr; 
 
function funcCalc() { 
 
var age = document.getElementById("age").value; 
 
var gender = document.getElementById("gender").value; 
 
var height = document.getElementById("height").value; 
 
var weigth = document.getElementById("weigth").value; 
 

 
if (gender == "masc") { 
 
bmr = 66.5 + (13.75 * weigth) + (5.003 * height) - (6.755 * age) 
 
} else { 
 
bmr = 655.1 + (9.563 * weigth) + (1.850 * height) - (4.676 * age) 
 
} 
 
document.getElementById("lblResult").innerHTML = bmr; 
 
} 
 

 
</script> 
 

 
</head> 
 

 
<body> 
 

 
<form action="#"> 
 
    <input type="radio" name="gender" id="gender" value="masc" checked> Male<br> 
 
    <input type="radio" name="gender" id="gender" value="fem"> Female<br> 
 
    Age:<br> 
 
    <input type="number" id="age" value="20"><br> 
 
    Height:<br> 
 
    <input type="number" id="height" value="180"><br> 
 
    Weight:<br> 
 
    <input type="number" id="weigth" value="80"><br> 
 
</form> 
 

 
<button type="button" 
 
onclick="funcCalc()"> 
 
Result</button> 
 

 
<p id="lblResult">BMR</p> 
 

 
</body> 
 

 
</html>

+2

你有两个带有'gender' ID的元素。一个页面上只能有一个ID。你总是会获得第一名。 – 2017-04-17 17:19:00

+0

由于只有两个,你可以阅读它的'.checked'属性而不是它的值。那么如果'真',你知道它是'masc',否则'fem'。 – 2017-04-17 17:19:39

+0

否则,使用'.querySelector'来获取选中的一个。 'var gender = document.querySelector(“input [name = gender]:checked”).value' – 2017-04-17 17:21:44

id属性的值必须在每一份文件是唯一的。所以你的HTML是无效的。相反,您可以使用getElementsByName来获取元素并检查每个元素的值。

let elements = document.getElementsByName('gender'); 
let isMale = elements[0].value === 'masc' || elements[1].value === 'masc';