如何寫一個變量undeath邊界

我對JS很新，我試圖做一個簡單的體重計算。它需要用戶的身高和體重進行計算並將其顯示在屏幕上。我已經完成了。現在我的問題是我想在「清除信息」按鈕下顯示結果作爲文本。我想使用DOM來做到這一點。如何寫一個變量undeath邊界

請任何幫助！

<!DOCTYPE html> 
    <html> 
    <head> 
    <meta charset="utf-8"> 
    <title>Assignment 4 Starter File</title> 

    <style> 
     h1 {text-align: center;} 

     #calculator 
     { 
     width: 600px; 
     margin: 0px auto; 
     border: 2px solid #000; 
     padding: 20px; 
     } 

     #values 
     { 
     width: 600px; 
     margin: 50px auto; 
     pading: 20px; 
     } 

     ul {margin-top: 5px;} 


    </style> 

    <script> 


     // code to be called when button is clicked goes here 
     function calculateResult() { 

     // this gets the weight 
     var weight = document.getElementById("weight").value; 
     //this gets the height 
      var height = document.getElementById("height").value; 
      // this calcualtes thet total with a 
      var calculate = (weight/Math.pow(height,2)) * 703; 
      //rounds to the 2 
      var New = calculate.toFixed(2); 
      New = parseInt(New); 
      alert(New); 
      // alert(" your weight is" + weight); 

    if(calculate <=18){ 
     ("your BMI IS: " + calculate); 
     // alert("your less then 18"); 

     } 




     } 

     window.onload = function() { 

     // reference the button to be clicked 
     var btnCalculate = document.getElementById("calculate"); 


     // calls the function when the button is clicked 
      btnCalculate.onclick = calculateResult; 

     } 
    </script> 



    </head> 

    <body> 

     <header> 
     <h1>Body Mass Index (BMI) Calculator</h1> 
     </header> 



     <section id="calculator"> 

     <p> 
      To determine if you're at a healthy weight, enter the following information 
      and calculate your body mass index (BMI). <span>Enter numbers only please</span> 
     </p> 

      <form> 

     <label for="weight" >Weight (lbs):</label> 
     <br> 
     <input type="text" id="weight"> 
     <br> 
     <br> 

     <label for="height" >Height (inches):</label> 
     <br> 
     <input type="text" id="height"> 
     <br> 
     <br>  

     <input type="button" id="calculate" value="Click to Calculate Your BMI"> <br> 
     <br> 
     <input type="reset" value="Clear the Information"> 
    <p style="color: red">The total is <span id= "total"> </span></p></p> 


     </section> 


     <section id="values"> 



     BMI values are as follows: 
     <ul> 
      <li>Below 18: Underweight</li> 
      <li>Between 18 and 24.9 : Normal</li> 
      <li>Between 25 and 29.9 : Overweight</li> 
      <li>Over 30 : Obese</li> 
     </ul> 

     </p> 

     </section> 

    <script type="text/javascript"> 



     </script> 

    </body> 
    </html>

來源

2015-02-23 venom vic

看到這個答案：http://stackoverflow.com/questions/1535268/js-how-to-dynamically-insert-text-into-a-span 基本上，您使用getElementById（）檢索範圍並將要顯示的結果分配到其innerHTML字段中。 – Tonkleton 2015-02-23 23:24:55

爲了達到此目的，您將使用innerHTML屬性。這將返回或設置元素的HTML內容。

所以我會做的是在您的calculateResult()函數中將您的alert(New);切換爲document.getElementById("total").innerHTML = New;。

這會將id ==「total」的span元素的HTML內容更改爲變量「New」的值。

所以它看起來像這樣。

function calculateResult() { 

    // this gets the weight 
    var weight = document.getElementById("weight").value; 
    //this gets the height 
    var height = document.getElementById("height").value; 
    // this calcualtes thet total with a 
    var calculate = (weight/Math.pow(height,2)) * 703; 
    //rounds to the 2 
    var New = calculate.toFixed(2); 
    New = parseInt(New); 

    document.getElementById("total").innerHTML = New;

JSFiddle

來源

2015-02-23 23:31:16 Magnus

謝謝！也是最後一件事。所以我想說的是，如果這個數字少於18，我想顯示你（那裏的數字），並且你的體重不足。我嘗試使用calculate變量添加If語句。這是正確的路嗎？ – 2015-02-23 23:54:54

當然。你在正確的軌道上。 – Magnus 2015-02-24 00:07:23

所以，如果（計算<= 18）{ 「你的體重不足」？我的問題是如何引用數字與你下面的重量字， – 2015-02-24 00:23:37

如何寫一個變量undeath邊界

回答

相關問題