1

Приветствую! Самостоятельно решил разработать скрипт корзины на jquery.

Удалось добиться суммирования количества товаров и их общей цен, но не могу понять как сделать вычитание общей суммы при нажатии определенной кнопки - то есть вычесть стоимость последнего добавленного товара из общей суммы.

Ниже код:

$(document).ready(function(){

    //add price and quantity in shoping cart

    $(".item_shop").on("click",".in_cart", function() {
        var price = +$(this).closest(".item_shop").data("price");
        $("#summ").text(function(i, val) {
            return val * 1 + price;
        });
        $("#items").text(function(i, val) {
            return val * 1 + 1;
        });
    });

    //remove items and quantity in shopnig cart 

    $(".right").on("click", function(event) {
        event.preventDefault();  
        var price = +$(this).closest(".item_shop").data("price");
        $("#summ").prev().val($("#summ").text()); // в данной строке все никак не могу придумать, что прописать чтобы уменьшалась сумма последнего добавленного товара. 

        $("#items").text(function(i, val) {
            return val * 1 - 1;  // здесь количество минусует, но также уходит в минус, что конечно не желательно.  
        });
    });

});// end of function

Заранее спасибо.

1 ответ 1

2

Сам принцип реализации корзины - не верен. Нужно где-то сохранять все товары, занесенные в корзину(ну если уж не товары, как в этом случае, то хотя-бы цены)

$(document).ready(function(){
  
    window.basket = {
      prices: [], // массив всех цен на все товары
      sumPrice: 0 // общая цена, если вдруг она изначально не 0 - задать ее
    };

    $(".item_shop").on("click",".in_cart", function() {
        
        var price = +$(this).closest(".item_shop").data("price");
        basket.prices.push(price);
        basket.sumPrice += price;
      
        update();
    });

    $(".right").on("click", function(event) {
        event.preventDefault();
      
        var lastPrice = basket.prices.pop();
        if(!lastPrice) return; // защита, чтобы меньше 0 не было:D
        basket.sumPrice -= lastPrice;
      
        update();
    });
  
    function update() {
        $("#summ").text(basket.sumPrice);
        $("#items").text(basket.prices.length);
    }

});// end of function

6
  • Большое спасибо за развернутый ответ! Однако кнопка с классом right почему-то по прежнему не работает (не уменьшает)
    – ilnur
    27 сен 2016 в 17:07
  • shop.js:21 Uncaught ReferenceError: price is not defined(anonymous function) @ shop.js:21dispatch @ jquery.min.js:3r.handle @ jquery.min.js:3
    – ilnur
    27 сен 2016 в 17:07
  • @ilnur скиньте, пожалуйста, больше кода, чтобы можно было увидеть что не так. можно на plnkr.co/edit/?p=catalogue или jsfiddle.net (или куда еще)
    – sanix
    27 сен 2016 в 17:11
  • plnkr.co/edit/w1kc6W5KMEwj5Kq4Z3dG?p=preview ссылка на часть штмл кода содержащего товары корзину и кнопку. ex-citer.myjino.ru/9/index.html ссылка на страницу полностью - .right - это стрелка направо под слайдером. Верстаю на бутстрапе.
    – ilnur
    27 сен 2016 в 17:33
  • @ilnur ошибка была банальнешая - basket.sumPrice -= lastPrice;, где вместо lastPrice было price. + добавил защиту, чтобы меньше 0 не было
    – sanix
    27 сен 2016 в 18:04

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.