计算每个元素的百分比

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%

那么，如何计算return下面的结果呢？

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>

计算每个元素的百分比

Calculate percent of each element

javascript

each

jquery

percentage