-1

私はクライアントのショッピングカートに取り組んでいます。商品画像の横に上下の矢印があり、購入したい商品の金額を選択できます。これを取得して、ショッピングカートも自動的に更新しようとしています。したがって、複数の値を持つアイテムはすべて自動的にカートに表示されます。

製品ごとに上ボタンと下ボタンが機能していますが、Ifステートメントのコードを追加すると、すべてが壊れます。また、商品ごとにIfステートメントが必要であり、ストアに70の商品がある可能性があるため、これを適切に行っているかどうかもわかりません。

Ifステートメントで変数を使用して一致するカートdivを取得し、それを表示する方法はありますか？

これがjsfiddlehttp : //jsfiddle.net/richcoy/7XnXF/です

4

3 に答える 3

2

これがあなたが探しているものだと思います。eq（）を使用して特定のインデックスを取得し、インデックスを使用して現在のインデックスを取得できます。.cart_product他のdivに従ってdivを構造化したのでdiv、クリックされた現在のインデックスを取得し、divそれを使用して対応するインデックスを表示/非表示にすることができますdiv

$(document).ready(function() {
    var num;
    $('.up').click(function() {
        num = parseInt($(this).siblings('.product').text());
        $(this).prevAll('.product').text(num + 1);        
        $('.cart_product').eq($(this).closest('.product_box').index()).show();// <-- on up click you will only ever show a product

    });

    $('.down').click(function() {
        num = parseInt($(this).siblings('.product').text());
        if (num > 0) {
        $(this).siblings('.product').text(num - 1);
        }

        if (parseInt($(this).siblings('.product').text()) == 0) { <-- check if current val in div is == 0
            $('.cart_product').eq($(this).closest('.product_box').index()).hide(); <-- if it is the hide the .cart_product div with the same index as the current "div"
        } else {
            $('.cart_product').eq($(this).closest('.product_box').index()).show();
        }
    });
});​

http://jsfiddle.net/7XnXF/12/

于 2012-07-21T13:09:43.427 に答える
0

このコードを試してください：

 $(document).ready(function() {
    var num;
    $('.up').click(function() {
          num = parseInt($(this).prevAll('.product').text());
          $(this).prevAll('.product').text(num+1);
        });

    $('.down').click(function() {
          num = parseInt($(this).prevAll('.product').text());
          if(num>0){
          $(this).prevAll('.product').text(num-1);
          };
        });

        // Uncommenting these breaks everything
        if ($('#product_item_one').nextAll('.product').text(num > 0)){
            $('#cart_item_one').show();
        };

        if ($('#product_item_two').nextAll('.product').text(num > 0)){
            $('#cart_item_two').show();
        };

        if ($('#product_item_one').nextAll('.product').text(num <= 0)){
            $('#cart_item_one').hide();
        };

        if ($('#product_item_two').nextAll('.product').text(num <= 0)){
            $('#cart_item_two').hide();
        };

});​
于 2012-07-21T11:44:51.553 に答える
0

このコードを試してください。

 $(document).ready(function() {
    var num;
     var $flag = 0;
     $('#cart_container').hide();
    $('.up').click(function() {
        $flag++;
          num = parseInt($(this).prevAll('.product').text());
          $(this).prevAll('.product').text(num+1);
          $('#cart_container').show();
        });

    $('.down').click(function() {
        $flag--;
          num = parseInt($(this).prevAll('.product').text());
          if(num>0){
          $(this).prevAll('.product').text(num-1);
          };
        if($flag < 1){
        $('#cart_container').hide();
        }
        });

        // Uncommenting these breaks everything
        if ($('#product_item_one').nextAll('.product').text(num > 0)){
            $('#cart_item_one').show();
        };

        if ($('#product_item_two').nextAll('.product').text(num > 0)){
            $('#cart_item_two').show();
        };

});

これがフィドルです。

お役に立てれば...:)

于 2012-07-21T13:00:16.347 に答える