BMI計算器JavaScript-有解無憂

我對 JavaScript 非常陌生，但我嘗試通過一些小專案挑戰自己。每當我陷入困境時，我都會搜索問題并嘗試以這種方式解決它，但是這次我無法弄清楚為什么我的代碼不起作用。

function berekenBMI() {
  var gewicht = Number(document.getElementById("gewicht"); // weight
  var lengte = Number(document.getElementById("lengte"); // height
  var BMI = gewicht / Math.pow(lengte, 2); // the calculation 

  document.getElementById("output").innerHTML = Math.round(BMI * 100) / 100;

  if (BMI < 18.5) document.getElementById("comment").innerHTML = '5';
  if (BMI >= 18.5 && BMI < 25) document.getElementById("comment").innerHTML = '2';
  if (BMI >= 25 && BMI <= 30) document.getElementById("comment").innerHTML = 'geen';
  if (BMI > 30) document.getElementById("comment").innerHTML = 'nooit geen';
}

<h2> BMI Berekenen </h2>

<div class="container">

  <label>Gewicht (KG): </label>
  <input type="text" id="gewicht">

  <label>Lengte (Meters): </label>
  <input type="text" id="lengte">

  <input type="submit" value="Bereken mijn BMI" onclick="berekenBMI()">

</div>

<h3>
  Jouw BMI is: <span id="output"> ? </span>
</h3>

<h4>
  Je mag <span id="comment"> zoveel </span> koekjes!
</h4>

uj5u.com熱心網友回復：

這里有2個問題。第一個相當簡單，您只是在分配gewicht和lengte變數以關閉Number函式時缺少右括號。

第二個問題對于未受過訓練的人來說不太明顯。在您的 JavaScript 中，您呼叫了document.getElementById()兩次，并嘗試將輸出轉換為Number兩次。的輸出document.getElementById是一個Element物件。它試圖將物件本身轉換為一個數字，該數字回傳 NaN（非數字）。要解決此問題，請.value在document.getElementById()您需要從中獲取字串值的每個之后添加。value 屬性包含文本框的字串值。對于幾乎所有需要輸入的元素來說都是如此。

uj5u.com熱心網友回復：

我猜您在使用 querySelector 時錯過了 #。# 當querySelector用于ID(getElementById)時使用，也關閉分配的var的括號，并使用.value從欄位中獲取值。

<script type="text/javascript">

        function berekenBMI() {
            var gewicht = Number(document.getElementById("#gewicht").value); // weight
            var lengte = Number(document.getElementById("#lengte").value); // height

            var BMI = gewicht / Math.pow(lengte, 2); // the calculation 

            document.getElementById("#output").innerHTML = Math.round(BMI * 100) / 100;

            if (BMI < 18.5) document.getElementById("#comment").innerHTML = '5';
            else if (BMI >= 18.5 && BMI < 25) document.getElementById("#comment").innerHTML = '2';
            else if (BMI >= 25 && BMI <= 30) document.getElementById("#comment").innerHTML = 'geen';
            else if (BMI > 30) document.getElementById("#comment").innerHTML = 'nooit geen';
        }


    </script>

轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/366123.html

標籤：javascript 功能计算

上一篇：使用Ramda的字典串列中的第一個非空值

下一篇：如何不讓inputType-file將資料發送到另一個php檔案？