jquery中的每个函数不循环答案

【问题标题】：Each function in jquery not loopingjquery中的每个函数不循环
【发布时间】：2015-11-23 22:19:39
【问题描述】：

我有一个使用 django 的包含以下值的表。

<tr>
    <td>Chips</td>
    <td>2</td>
    <td>20.00</td>
    <td id='totalperitem'>40.00</td>
</tr>

<tr>
    <td>pizza</td>
    <td>2</td>
    <td>100.00</td>
    <td id='totalperitem'>200.00</td>
</tr>

<tr>
    <td>Peanut Butter</td>
    <td>2</td>
    <td>50.00</td>
    <td id='totalperitem'>100.00</td>
</tr>

我正在尝试使用 jquery 'each' 函数获取 totalperitem 列的总数。但是，我只得到第一项的价值。

jquery 语法：

$('#totalperitem').each(function () {
    running_total += parseInt($(this).text());
    console.log('sum : ' + running_total);
});

这是我进入控制台的输出

sum : 40

我做错了什么？

谢谢，千焦

【问题讨论】：

id 属性必须是唯一的。它是一个标识符，因此用于标识单独的元素。
Id 应该是唯一的！给他们上课

标签： javascript jquery django

【解决方案1】：

一个页面中不允许有多个具有相同 ID 的元素。

使用class 而不是id

<td class='totalperitem'>200.00</td>

并使用.totalperitem 作为选择器。

var running_total = 0;
$('.totalperitem').each(function(){
    running_total += parseInt($(this).text());
    console.log('sum : ' + running_total);
});

【讨论】：

【解决方案2】：

使用class 而不是id 并这样做，

var sum = $('.totalperitem').get().reduce(function(a,b){
  return a + parseFloat(b.innerHTML);
},0);

【讨论】：