使用JavaScript计算百分比

-6

我有一个表单，我希望用户输入几个字段，表单将计算目标的总数和百分比。我是JavaScript新手，我不知道如何计算百分比。当我尝试parseInt(total)/parseInt(goal)*100我得到NaN的错误：使用JavaScript计算百分比

<html> 
    <head> 
    <style media="screen"> 
     .testform INPUT { 
      display: block; 
      margin-bottom: 10px; 
      border: 1px solid #212121; 
      height: 35px; 
      font-size: 16px; 
     } 
    </style> 
    <script type="text/javascript"> 
     calculate = function() { 
      var cash = document.getElementById('a1').value; 
      var checks = document.getElementById('a2').value; 
      var coin = document.getElementById('a3').value; 
      var goal = document.getElementById('goalamount').value; 
      var total = document.getElementById('a4').value; 

      document.getElementById('a4').value = parseInt(cash)+parseInt(checks)+parseInt(coin); 
      document.getElementById('a5').value = parseInt(total)+parseInt(goal); 
     } 
    </script> 
    </head> 
    <body> 
    <form class="testform"> 
     Goal amount <input id="goalamount" type="text" value="3000"/> 
     Cash Collected <input id="a1" type="text" /> 
     Checks Collected <input id="a2" type="text" /> 
     Coins Collected <input id="a3" type="text" /> 
     Total Collected <input id="a4" type="text" name="total_amt" onblur="calculate()" /> 
     Percent of Goal<input id="a5" type="text" name="goal_amt" /> 
    </form> 
    </body> 
</html>

来源

2016-09-30 Don85203

的Java = JavaScript的 – shmosel

你'total_amt'和'goal_amt'输入字段改变'型=！ “text”到'type =“number”'。这将确保只有数字在这些字段中输入。 –

您在什么时候尝试计算百分比？你把代码中的'parseInt（total）/ parseInt（goal）* 100'放在哪里？我的猜测是，你得到的NaN是因为你在某个时候尝试了parseInt（“”），这将表明你提到的其中一个输入没有任何值，或者可能是一个不是数字的值。 –

我在我的本地环境中运行你的代码，然后知道为什么抛出NaN异常。根据上面的代码从html输入元素值中检索变量总数，但在执行行parseInt(cash)+parseInt(checks)+parseInt(coin);之前，总变量将为空字符串。之后，parseInt将空字符串解析为int后返回NaN。所以你会在百分比输入框中看到NaN。

还有就是要解决这个问题的解决方案：代码如下：

var goal = document.getElementById('goalamount').value; 

document.getElementById('a4').value = parseInt(cash)+parseInt(checks)+parseInt(coin); 

var total = document.getElementById('a4').value;

...

来源

2016-09-30 05:01:41 Tony

的NaN表示 “不是一个数字”。检查total是否可以被解析为整数，检查目标是否可以被解析为整数并且该值不为零，那么你应该很好。

来源

2016-09-30 04:44:00 Olesia

使用JavaScript计算百分比

回答

相关问题