BMI计算器显示NaN而不是值[重复]

Question

这个问题在这里已有答案：

• Javascript getElementsByName.value not working 3回答

我想制作我的计算器...在这个计算器中，你输入你的身高，体重和性别，然后点击按钮和我的计算器，计算你的BMI。

function cal() {
  var h = document.getElementsByName("height").value; //it's get my height
  var w = document.getElementsByName("weight").value; //it's get my weight
  var r = (w / (h * h)) * 10000; //it's calculate MBI
  document.getElementById("calcu").innerHTML = r; //the answer shows under my form
  alert(r);
}

<form>
  <fieldset>
    <legend>محاسبه BMI</legend>//it's calculate BMI قد (cm)<br>//it's height
    <input type="number" name="height" placeholder="175" value="175"><br> وزن (kg)<br>//it's weight
    <input type="number" name="weight" placeholder="75" value="73"><br> جنسیت
    <br>//it's gender
    <input type="radio" name="female" value="gender">زن//women
    <input type="radio" name="male" value="gender">مرد//man<br><br>
    <input type="button" value="محاسبه" onClick="cal()"><br>//calculator button
    <p id="calcu"></p>
  </fieldset>
</form>

Answer 1

您需要1：每次只选择一个元素，2：将值转换为数字：

function cal() {
  var h = parseInt(document.getElementsByName("height")[0].value);
  var w = parseInt(document.getElementsByName("weight")[0].value);
  var r = (w / (h * h)) * 10000; //it's calculate MBI
  document.getElementById("calcu").innerHTML = r; //the answer shows under my form
  alert(r);
}

<form>
  <fieldset>
    <legend>محاسبه BMI</legend>//it's calculate BMI قد (cm)<br>//it's height
    <input type="number" name="height" placeholder="175" value="175"><br> وزن (kg)<br>//it's weight
    <input type="number" name="weight" placeholder="75" value="73"><br> جنسیت
    <br>//it's gender
    <input type="radio" name="female" value="gender">زن//women
    <input type="radio" name="male" value="gender">مرد//man<br><br>
    <input type="button" value="محاسبه" onClick="cal()"><br>//calculator button
    <p id="calcu"></p>
  </fieldset>
</form>

Answer 2

document.getElementsByName返回元素集合，.value未定义。你应该访问使用它的第一个元素

document.getElementsByName("...")[0].value

并使用+转换它的数量

function cal(){
	var h= +document.getElementsByName("height")[0].value;//it's get my height
	var w= +document.getElementsByName("weight")[0].value;//it's get my weight
	var r= (w/(h*h))*10000;//it's calculate MBI
	document.getElementById("calcu").innerHTML=r;//the answer shows under my form
	alert(r);
}

<form>
 			 <fieldset>
  			  <legend>محاسبه BMI</legend>//it's calculate BMI
  				  قد (cm)<br>//it's height
   				 <input type="number" name="height" placeholder="175" value="175"><br>
  				  وزن (kg)<br>//it's weight
   				 <input type="number" name="weight" placeholder="75" value="73"><br>
				 جنسیت<br>//it's gender
				 <input type="radio" name="female" value="gender">زن//women
				 <input type="radio" name="male" value="gender">مرد//man<br><br>
  				  <input type="button" value="محاسبه" onClick="cal()"><br>//calculator button
				 <p id="calcu"></p>
  			</fieldset>
			</form>

Answer 3

function cal(){
	var h= document.getElementsByName("height")[0].value;
	var w= document.getElementsByName("weight")[0].value;
	var r= (w/(h*h))*10000;
	document.getElementById("calcu").innerHTML=r;
	alert(r);
}

<div class="sectionmenu">
			<form>
 			 <fieldset>
  			  <legend>محاسبه BMI</legend>
  				  قد (cm)<br>
   				 <input type="number" name="height" placeholder="175" value="175"><br>
  				  وزن (kg)<br>
   				 <input type="number" name="weight" placeholder="75" value="73"><br>
				 جنسیت<br>
				 <input type="radio" name="female" value="gender">زن
				 <input type="radio" name="male" value="gender">مرد<br><br>
  				  <input type="button" value="محاسبه" onClick="cal()"><br>
				 <p id="calcu"></p>
  			</fieldset>
			</form> 
	
</div>