计算百分比

Question

我有下面的代码来计算各元素的比例（如投票表决系统）：

$(document).ready(function() { 
 
    $("#percentage").click(function() { 
 
     var number, sumNumbers = 0, newPercent; 
 
    
 
     $(".item").each(function() { 
 
      number = $(this).children(".itemNum").text(); 
 
      number = +number; 
 

 
      sumNumbers += number; 
 

 
      if(sumNumbers != 0) { 
 
       newPercent = (number/sumNumbers) * 100; 
 
      } else { 
 
       newPercent = 0; 
 
      } 
 

 
      $(this).children(".percentage").text(newPercent+"%"); 
 
     }); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div class="item"> 
 
    <span class="itemNum">0</span> <span class="percentage"></span> 
 
</div> 
 

 
<div class="item"> 
 
    <span class="itemNum">2</span> <span class="percentage"></span> 
 
</div> 
 

 
<div class="item"> 
 
    <span class="itemNum">1</span> <span class="percentage"></span> 
 
</div> 
 

 
<button id="percentage">Calculate Percentage!</button>

但是，结果是：

0 0% 
2 100% 
1 33.33333333333333% 

那么，如何计算返回以下结果呢？

0 0% 
2 66.66666666666667% 
1 33.33333333333333% 

我需要这些结果在我的轮询系统上做一个进度条，所以，如何做到这一点？

Answer 1

您需要通过解析文本为整数parseInt（）函数。

而你需要首先总结数字，然后你可以计算出百分比。

对于一个循环问题：
您无法在一个循环中统计百分比。解释here

$(document).ready(function() { 
 
    $("#percentage").click(function() { 
 
     var number, sumNumbers = 0, newPercent; 
 
     $(".item").each(function(){ 
 
       number = $(this).children(".itemNum").text(); 
 
       sumNumbers += parseInt(number); 
 
       
 
      }); 
 
     $(".item").each(function() { 
 
      number = parseInt($(this).children(".itemNum").text()); 
 

 
      if(sumNumbers != 0) { 
 
       newPercent = (number/sumNumbers) * 100; 
 
      } else { 
 
       newPercent = 0; 
 
      } 
 

 
      $(this).children(".percentage").text(newPercent+"%"); 
 
     }); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div class="item"> 
 
    <span class="itemNum">0</span> <span class="percentage"></span> 
 
</div> 
 

 
<div class="item"> 
 
    <span class="itemNum">2</span> <span class="percentage"></span> 
 
</div> 
 

 
<div class="item"> 
 
    <span class="itemNum">1</span> <span class="percentage"></span> 
 
</div> 
 

 
<button id="percentage">Calculate Percentage!</button>