来自具有相同类名的段落的输入或字符串的值之和总是显示“0”

Question

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

ul的结构是这样的：

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

我尝试使用来自同一类的不同div的值的和按段落字符串求和,但控制台输出总是显示“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。

null

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>