2014-04-01 106 views
-4

我在BMI计算器的html正文中有一个javascript。一切工作到目前为止都是我自己的。我只需要帮助两件事情,我不能弄清楚。 首先我不能得到输出BMI计算到2个小数位。我曾尝试使用toFixed(2)和双倍没有运气。圆到小数位的位数

而且当您输入第一个变量时,它会突出显示表中的注释。当你做第二次输入(结果不同)时,它会突出显示一个新字段并保留旧字段。 (不会令人耳目一新),也无法想象。下面

 <html> 

     <head> 

    <title>Body Mass Index (BMI) Calculator</title> 
    <script language="JavaScript"> 
    //Variables Input 

    <!-- 
     function calcBmi() { 
var weight = document.bmiForm.weight.value //Input of Weight 

var height = document.bmiForm.height.value //Input of Height 



//Calculation of BMI 

if(weight > 0 && height > 0){ 
var finalbmi = weight/(height/100*height/100) 
document.bmiForm.finalbmi.value = finalbmi 

//Incorrect Input of Numeric Variables 
var rvalue = true 
if ((weight < 30) || (weight > 450)) 
    { alert ("Invalid weight. Please check and re-enter"); 
     rvalue = false 
    } 
if ((height < 80) || (height > 300)) 
     { alert ("Invalid Height. Please check and re-enter"); 
     rvalue = false 
    } 
//Highlighted Decisions are made below 

if(finalbmi < 18){ 
document.getElementById('tr1').style.backgroundColor="grey"; 
    } 
    if(finalbmi > 18 && finalbmi < 19.999){ 
    document.getElementById('tr2').style.backgroundColor="grey"; 
} 
if(finalbmi > 20 && finalbmi < 25.999){ 
document.getElementById('tr3').style.backgroundColor="grey"; 
} 
if(finalbmi > 26 && finalbmi < 30.999){ 
document.getElementById('tr4').style.backgroundColor="grey"; 
} 
if(finalbmi > 31){ 
document.getElementById('tr5').style.backgroundColor="grey"; 
} 
} 
//Incorrect Characters Inserted, this message is an error code 
else{ 
alert("Error, Please Fill In Numeric values Only ") 
} 
} 
//--> 
//--> CSS Style Formatting 
</script> 
    <style> 
     .container { 
      width: 100%; 
      } 
     .wrapper { 
      margin: 0 auto; 
      width: 800px; 
      } 
     table { 
      width: 500px; 
      border: 10px solid #666; 
      margin: 0 auto; 
      } 
     form { 
      text-align: center; 
      } 
    </style> 
    </head> 

    <body> 
    <div class="container"> 
    <div class="wrapper"> 
     <form name="bmiForm"> 
      <p> 
      <p> 
      Your Weight(kg): <input type="text" name="weight" size="11"><br /> 
      <p> 
      <p> 
      Your Height(cm): <input type="text" name="height" size="11"><br /> 
      <p> 
      <p> 
      <input type="button" value="Calculate BMI" onClick="calcBmi()"><br /> 

      <p> 
      <p> 
      Your BMI: <input type="text" name="finalbmi" size="11"><br /> 
      <p> 
      <p> 
      <!--Highlighted Desicions shown below --> 
      <table id="bmitable" border="1" width="40%" cellpadding="5"  cellspacing="5" style="background-color:white;"> 
      <tr id='tr1'> 
        <td colspan="2"><font size="2">Under 18 - Your Are  Very Underweight and Possibly Malnourished.</font></td> 
      </tr> 
     <tr id='tr2'> 
        <td colspan="2"><font size="2">Under 20 - You Are  Underweight and Could Afford to Gain a Little Weight.</font></td> 
     </tr> 
      <tr id='tr3'> 
        <td colspan="2"><font size="2">20 to 25 - You Have a  Healthy Weight Range for a Young and Middle-Aged Adults.</font></td> 
      </tr> 
      <tr id='tr4'> 
        <td colspan="2"><font size="2">26 to 30 - You Are  Overweight.<font></td> 
      </tr> 
      <tr id='tr5'> 
        <td colspan="2"><font size="2">Over 30 - You Are  Obese</font></td> 
      </tr> 
      </table> 
     </form> 
    </div> 
<div> 
</body> 

</html> 
+2

不要在这里打赌java不是javascript。 –

+0

够公平的,但为什么不在这里,我已经看到类似的问题问及答复小数问题。我曾试图在手之前做这项研究,甚至还没有做到这一点。 – user3484739

+0

我可能无法解决您的问题。但是,得到低价和没有答案的原因是你没有简要地证明你的问题。你只是倾销你的代码,并寻求帮助。请减少您的代码并发布可疑代码。如果可能的话创建一​​个[小提琴](http://jsfiddle.net/)。人们喜欢解决很好理解的问题:)希望你明白。 –

回答

0

toFixed

脚本为我工作

document.bmiForm.finalbmi.value = new Number(finalbmi).toFixed(2); 

还需要设置其他TRS白色的背景如下

if(finalbmi < 18){ 
    document.getElementById('tr1').style.backgroundColor="grey"; 
} 
else{ 
    document.getElementById('tr1').style.backgroundColor="white"; 
} 

Click Here for Fiddle

+1

谢谢,我看你有什么,我加入 document.bmiForm.finalbmi.value = finalbmi.toFixed(2); – user3484739