2

ユーザーがショッピングカートに追加したアイテムの小計を取得しようとしていますが、機能しないようです。

基本的に、アイテムのリストがあり、その上に、ショッピングカートにHTMLを追加するjquery関数にリンクされている[カートに追加]ボタンがあります。

$('#object01').click(function(){
    if ($('#slideShoppingCart').is(":hidden")) {
    $('#slideShoppingCart').slideToggle(500);   
    $('#objectList').append('<div class="shoppingCartObject"><img src="img/leather-backpack-cart.jpg" width="75" height="75"><div class="cartObjectInfo"><h1 class="cartTitle">Gentleman&#39;s Satchel</h1><div class="closeCartObject">x</div><h2 class="cartDescription">Chestnut Leather</h2><h3 class="quantity">QTY. 1</h3><h3 class="cartPrice">£<span class="price">300</span></h3></div></div>')
    } else {
        $('#objectList').append('<div class="shoppingCartObject"><img src="img/leather-backpack-cart.jpg" width="75" height="75"><div class="cartObjectInfo"><h1 class="cartTitle">Gentleman&#39;s Satchel</h1><div class="closeCartObject">x</div><h2 class="cartDescription">Chestnut Leather</h2><h3 class="quantity">QTY. 1</h3><h3        class="cartPrice">£<span class="price">300</span></h3></div></div>')
    }
    });
    $('.closeCartObject').live('click', function() {
    $(this).parent().parent().remove();

    return false;
});

価格というクラスのスパンで価格をラップしています。次に、ショッピングカートに合計IDのスパンがあります。

価格を計算するこの関数がありますが、機能していないようです。

$(document).ready(function getTotal(){
var total = 0;
$('.price').each(function(){
    total += parseFloat(this.innerHTML)
});
$('#total').text(total);
getTotal();
});
4

3 に答える 3

1

計算ロジックが機能しているようです

var total = 0;
$('.price').each(function(){
    total += parseFloat(this.innerHTML)
});

しかし問題は、それ自体の中で「getTotal()」関数を呼び出していることです。

試す

$(document).ready(function() {

var getTotal = function(){
  var total = 0;
  $('.price').each(function(){
      total += parseFloat(this.innerHTML);
  });
  return total;
}  

$('#total').text(getTotal());

});
于 2012-11-16T00:23:00.450 に答える
1

あなたの機能：

$(document).ready(function getTotal(){
var total = 0;
$('.price').each(function(){
    total += parseFloat(this.innerHTML)
});
$('#total').text(total);
getTotal();
});

getTotal() から getTotal() への呼び出しが含まれています。不注意な再帰があります。

編集: OK、これを試してください: (ただし、コードに jsfiddle があれば簡単です)

$(document).ready(function ()
{
    var total = 0;
    $('.price').each(function()
    {
        total += parseFloat(this.innerHTML)
    });

    $('#total').text(total);
});
于 2012-11-16T00:17:04.953 に答える
0

JS を<script defer="defer">タグに入れてみてください。これは最後に実行されることを意味します - Dom が完全に終了する前に関数が計算しようとする可能性があります (ただし、これは以前のバージョンの jQuery でのみ行われた可能性があります)。

または、setTimeout を追加して、数秒後に小計関数を呼び出します。

関数にいくつかのアラートを追加することもできます。ターゲットにしようとしているフィールドが正しくターゲットにされていることを確認してください。

Defer: <script defer="defer"> はどのように機能しますか?

setTimeout: https://developer.mozilla.org/en-US/docs/DOM/window.setTimeout

于 2012-11-16T00:12:54.253 に答える