jQuery總結跨度中的文本值

Question

我需要某種方式來總結跨度中的文本值，但是我只能提取它們而不能總結。 有沒有辦法正確地做到這一點？ 我對代碼不了解，我是jQuery的新手。

演示： http : //jsfiddle.net/0L4s6g8p/1/

HTML：

<div class="prices"> 

    <h3>Option 1 = $<span class="sum" id="option-1">11.11</span></h3>
    <h3>Option 2 = $<span class="sum" id="option-2">22.22</span></h3>
    <h3>Option 3 = $<span class="sum" id="option-3">33.33</span></h3>

</div>

<h3>Subtotal = $<span id="subtotal">0.00</span></h3>

腳本：

$('.prices').each(function(){
      var sum = $('.sum').text();
      $(this).each(function(){
        sum += parseInt($('.sum').text());
      });
      $("#subtotal").text(sum);
    });

Answer 1

您需要遍歷每個sum元素並將其sum

 var sum = 0; $('.sum').each(function() { sum += +$(this).text()||0; }); $("#subtotal").text(sum); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <div class="prices"> <h3>Option 1 = $<span class="sum" id="option-1">11.11</span></h3> <h3>Option 2 = $<span class="sum" id="option-2">22.22</span></h3> <h3>Option 3 = $<span class="sum" id="option-3">33.33</span></h3> </div> <h3>Subtotal = $<span id="subtotal">0.00</span></h3> 

Answer 2

非常簡單！ 使用以下代碼：

var total = 0;
$('.prices .sum').each(function(){
      total += parseInt($(this).text());
      $("#subtotal").text(total);
});

Answer 3

您剛剛犯了幾個簡單的錯誤：

1. 您應該將計算腳本包含在小計函數內，否則它只會在加載時調用，而不會再次調用。

2. 您在第一次分配總和時缺少parseInt。 實際上，sum是一個字符串，僅得到串聯。 但是，這是一個錯誤的開始，您將一個值相加兩次。

這是更正的腳本：

var flyersprice = '0.00';

function subtotal(){

    var price = $("#quantity option:selected").attr("data-price");

    flyersprice = $("#quantity option:selected").val() * price;

    $("#flyers").text(flyersprice.toFixed(2));

    $(".paper li").click(function(){
        var selected = $(this).data("price") * $("#quantity option:selected").val();
        $("#papertype").text(selected.toFixed(2));
    });

    $("input[type=radio]").click(function(){
        var extra = $(this).data("price");
        $("#extraoptions").text(extra);
    });
    $('.prices').each(function(){
      var sum = 0.0;
      $(this).each(function(){
        sum += parseInt($('.sum').text());
      });
      $("#subtotal").text(sum);
    });
 }

您還應該從html中取出“ onchange”屬性並添加到腳本中：

$('input').change(subtotal);
$('select').change(subtotal);

沒錯，但是最好將腳本和html分開。