javascript - 无法从 javascript 获得答案以显示在 HTML 页面上

Question

作为练习，我一直在制作一个简单的 BMR/TDEE/BMI 计算器。我让 HTML 和 CSS 工作正常，但是，虽然我认为 Javascript 代码很好并且公式是正确的，但我无法从代码中获得结果以显示在我的计算器上。我希望我能对我做错了什么有所了解。

// Create variables

var height = document.getElementById("height").value / 39.37;
var weight = document.getElementById("weight").value / 2.205;
var activity = document.getElementById("activity").value;
var gender = document.getElementsByClassName("dataGender").value;
var age = document.getElementById("age").value;

//Calculate Tip
function calculateBMI(height, weight) {

  //validate input
if (height === "" || weight == 0) {
alert("Please enter values");
return;
  }

  //Calculate BMI
  var bmi = height / math.pow(weight, 2);
  //round to two decimal places
  bmi = Math.round(bmi * 100) / 100;
  //next line allows us to always have two digits after decimal point
  bmi = bmi.toFixed(2);
  return bmi;
}

function calculateBMR(height, weight, age, gender) {

  var bmr = null;
  switch (gender) {
    case "male":
      bmr = 66.5 + (13.75 * weight) + (5.003 * height) - (6.755 * age);
      break;
    case "female":
      bmr = 655.1 + (9.563 * weight) + (1.850 * height) - (4.676 * age);
      break;
  }
  return bmr;
}

function calculateTDEE(bmr) {

  var tdee = null;
  switch (activity) {
    case "Sedentary":
      tdee = Math.round(bmr * 1.2);
      break;
    case "Light Exercise (1-2 days/week)":
      tdee = Math.round(bmr * 1.375);
      break;
    case "Moderate Exercise (3-5 days/week)":
      tdee = Math.round(bmr * 1.55);
      break;
    case "Heavy Exercise (6-7 days/week)":
      tdee = Math.round(bmr * 1.725);
      break;
    case "Athlete (2x per day)":
      tdee = Math.round(bmr * 1.9);
      break;
  }
  return tdee;
}

function displayResults(bmi, bmr, tdee) {

  //Display the results
  document.getElementById("bmr").style.display = "block";
  document.getElementById("bmr").innerHTML = bmr;
  document.getElementById("bmi").style.display = "block";
  document.getElementById("bmi").innerHTML = bmr;
  document.getElementById("tdee").style.display = "block";
  document.getElementById("tdee").innerHTML = tdee;
}

//click to call function
document.getElementsByClassName("butn").onclick = function() {
  displayResults();

};

当我点击网页上的“计算”按钮时，它只显示一个空白块。帮助将不胜感激。谢谢你。

标签： javascriptdom