javascript - jqueryを使用して値を一緒に追加します

Question

各アイテムと送料の価格を保持する3つのスパンタグがあります。jQueryを使用して合計価格を算出するには、3つのスパンタグを一緒に追加する必要があります。これが私のコードです：

<div id="relative">
    <div id="absolute">
        Widget 1: <span id="widget_1_price">$99.99</span><br />
        Widget 2: <span id="widget_2_price">$14.99</span><br />
        Shipping Fee: <span id="shipping_price">$10.00</span><br />
        <b>Total: <span id="total_price"></span></b>
    </div>
</div>

私はいくつかの方法を試しましたが、どれもうまくいかないようです。

Answer 1

要素をループしてその中のテキストを解析し、それらを一緒に追加します。

var sum = 0;
$('#widget_1_price,#widget_2_price,#shipping_price').each(function(){
  sum += parseFloat($(this).text().substr(1));
});
$('#total_price').text('$' + Math.round(sum * 100) / 100);

デモ： http： //jsfiddle.net/QTMsE/

Answer 2

var val1 = parseFloat($("#widget_1_price").text().substring(1));
var val2 = parseFloat($("#widget_2_price").text().substring(1));
var shipping = parseFloat($("#shipping_price").text().substring(1));

var all = val1 + val2 + shipping;
$("#total_price").text("$"+all);

これを試して。

Answer 3

これを試して：

total = parseFloat($('#widget_1_price').text().slice(1))+
        parseFloat($('#widget_2_price').text().slice(1))+
        parseFloat($('#shipping_price').text().slice(1));

$('#total_price').text('$'+total);