JavaScript计算元素的总价

标签 javascript jquery

请帮我输入所选商品的总价。 这是 JSFiddle

 <section id="items">
   <div class="item">Monitor <span class="price">100$</span></div>
   <div class="item">Mouse <span class="price">20$</span></div>
   <div class="item">Keyboard <span class="price">60$</span></div>
 </section>
 <section id="basket">
   <p>Total price:<span class="total_price"></span></p>
 </section>`

最佳答案

此代码将动态运行。即使您添加或删除项目,它也应该有效。

var priceList = $('#items').find('.price');

var totalPrice = 0;

$.each(priceList, function(i, price){
  
totalPrice += parseInt($(price).text())
  
  });

$('.total_price').text(totalPrice);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<section id="items">
    <div class="item">Monitor <span class="price">100$</span></div>
    <div class="item">Mouse <span class="price">20$</span></div>
    <div class="item">Keyboard <span class="price">60$</span></div>
</section>
<section id="basket">
    <p>Total price:<span class="total_price"></span></p>
</section>

关于JavaScript计算元素的总价,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29397155/

相关文章:

Javascript时间戳格式化与正则表达式?

jquery - 如何在使用 Jquery 插入之前检查特定的 html 元素是否已经存在

javascript - 如何使用属性来显示隐藏带有 CSS3 过渡的元素?

javascript - jQuery change() 事件 - 不适用于 bind()、live()、keyup+keydown+keypress,什么都没有

javascript - 从 jQuery 中删除 HTML 元素

javascript - AngularJS 中 $q 的含义是什么?

javascript - 如何使用JavaScript中的函数转换温度

javascript - V-bind等级多种选择

javascript - 表单提交时未调用 Ajax 函数

javascript - 如何将 javascript 添加到 HTML 页面?