使用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計算百分比

回答

相關問題