Question

我在更改完整的电子书＆＃34;时，我无法更新总数。产品数量。当我第一次设置数量并将其添加到篮子时，它会显示篮子中的正确总数，但是当我更改数量时，它会添加到之前的总数中。总的来说，我希望能够在篮子总数中添加多个产品（x += p2Total的原因（x var是总数 - 第86行），但允许更改产品的数量然后更新总数。

Codepen Here > 有问题的产品是前2名

JS：

// JQuery Functions for NavBar - Class Toggle

(function() {
  $('.hamburger-menu').on('click', function() {
    $('.bar').toggleClass('animate');
  })
})();

(function() {
  $('.hamburger-menu').on('click', function() {
    $('.bar2').toggleClass('ApprDown');
  })
})();

/* 

START OF BASKET 
START OF BASKET


*/

// Get access to add to basket basket button
var addToBasket = document.querySelector('.atbb');
addToBasket.addEventListener('click', P1);

// Formatter simply formats the output into a currceny format istead of a general number format. This is using the ECMAScript Internationalization API 

var formatter = new Intl.NumberFormat('en-US', {
  style: 'currency',
  currency: 'GBP',
  minimumFractionDigits: 2,
});

var totalBasket
var discountLimit = 10
var discount = 3.50
var x = 0.00
// One big function with different condtions based on the differnt products and then simply concatinate the values where needed
function P1() {
  var y = document.getElementById("p1Quant").value;
  if (+y > discountLimit) {

    var z = 15.000
    x = parseFloat(+y) * parseFloat(+z); // + will convert the vars into Numbers etc
    document.getElementById("BasketSumData").innerHTML = ("Sub Total: ") + formatter.format(x) + ("<br/>") + ("<hr />") + ("<div class='strike'>Plus £3.50 Delivery</div>") + ("<br/>") + ("<hr />") + ("Total: ") + formatter.format(x)

//     Jquery Notificaiton  

 var truckVar = document.getElementById("truck");
    truckVar.setAttribute("class", "animateTruck");




  } else if (+y <= 0) {

    document.getElementById("BasketSumData").innerHTML = ("Sub Total: ") + formatter.format(0) + ("<br/>") + ("Total: ") + formatter.format(0)

  } else {

    var z = 15.000
    var s = 15.000
    x = parseFloat(+y) * parseFloat(+z) + 3.50
    var sub = parseFloat(+y) * parseFloat(+s)
    document.getElementById("BasketSumData").innerHTML = ("Sub Total: ") + formatter.format(sub) + ("<br/>") + ("<hr />") + ("Plus £3.50 Delivery") + ("<br/>") + ("<hr />") + ("Total: ") + formatter.format(x)

  }
}



var addToBasket2 = document.querySelector('.atbb2');
addToBasket2.addEventListener('click', P2);

function P2() {

    p2Total = 0.00
  var y = document.getElementById("p2Quant").value;


    var p2 = 8.00
   var p2Total = parseFloat(+y) * parseFloat(+p2); // + will convert the vars into Numbers etc
   // var totalBasket = + x + x  // javascript add value onto set var

   x += p2Total // Append the amount to the basket 

   document.getElementById("BasketSumData").innerHTML = ("Sub Total: ") + formatter.format(x) + ("<br/>") + ("<hr />") + ("<div class='strike'>Plus £3.50 Delivery</div>") + ("<br/>") + ("<hr />") + ("Total: ") + formatter.format(x)


  if (+y <= 0) {

    p2Total = 0.00

  }
}

Answer 1

不要将值添加到x，将x和p2Total添加到一个新的临时值，该值作用于函数本身并使用它。

var tmp_total = x + p2Total;
document.getElementById("BasketSumData").innerHTML = ("Sub Total: ") + formatter.format(tmp_total) + ("<br/>") + ("<hr />") + ("<div class='strike'>Plus £3.50 Delivery</div>") + ("<br/>") + ("<hr />") + ("Total: ") + formatter.format(tmp_total)

更改数量时更新总变量

1 个答案: