来自具有相同 class 名称的段落的输入或字符串的值总和始终显示“0”

Question

我有一个简单的购物车 div，其中有 ul 个选择的产品列表。我想显示所有产品的价格总和，但无法计算出来（li 是动态创建的，可以从购物车中删除，因此总和也应该动态工作）。

ul 的结构如下所示：

<ul id='koszyk'>
 <li>
   <input type='hidden' class='price' value='20'>
   <p class='p_price'>20 zł</p>
   <...>
 </li>
</ul>

我尝试使用此 Sum of values from different divs with the same class 按段落字符串求和，但控制台输出始终显示 '0':

var sum = 0;
$('.p_price').each(function(){
   sum += parseFloat($(this).text());                                    
});
console.log(sum);

脚本在 ul 中。我也试过这个，但结果相同：

var sum = 0;
$('.price').each(function(){
   sum += parseFloat($(this).valueOf());                                    
});
console.log(sum);

我也试过用数组来存储所有价格，但我不擅长用数组操作。这可能是一些简单的错误，因为我还是初学者，所以我也更喜欢尽可能简单的解决方案。

Answer 1

使用val()方法代替valueOf()获取输入元素的value。

var sum = 0;
$('.price').each(function(){
   sum += parseFloat($(this).val());                                    
});
console.log(sum);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul id='koszyk'>
 <li>
   <input type='hidden' class='price' value='20'>
   <p class='p_price'>20 zł</p>
   <...>
 </li>
</ul>

来自具有相同 class 名称的段落的输入或字符串的值总和始终显示“0”

sum of values from inputs or strings from paragraphs with same class names always shows '0'

javascript

jquery

sum

classname