试图更改“ total_price”变量的值,但在Javascript中却得到“未定义”

时间:2018-11-04 18:39:55

标签: javascript

因此,我的目标是建立一个购物车,以计算n件商品的总价。我可以增加/减少每个项目的数量,因此除我的UpdateCartTotal函数外,其他所有东西都可以正常工作-它显示的是未定义的而不是总价。我该如何解决?

    function getinput(event) {
      return event.target.parentElement.querySelector(".quantity");
    }

 // the Event Listener 
    document.addEventListener("click", function(event) {
      if (event.target.className == "plus-btn") {
        increment(event);
        updateCarteTotal(event)
      }
      if (event.target.className == "minus-btn") {
        decrement(event)
        updateCarteTotal(event)
      }
    });

 // Increment function

    function increment(event) {
      var quantity = getinput(event)
      if(quantity.value<20){
         quantity.value++
        }
    }
  // Decrement function 
    function decrement(event) {
      var quantity = getinput(event)
      if(quantity.value >=1){
         quantity.value--
        }
    }

// the function to calculate the totale Carte price

    function updateCarteTotal(event) {

        const items=document.querySelectorAll(".item");
        var total_price=document.querySelector(".total_price");
        var quantity=getinput(event);
        var unit_price=document.querySelectorAll(".price");
        var total=0;
        for(item of items ){   
            total += parseInt(quantity.value * unit_price.value)
        }
        total_price.value=total.value
    }

1 个答案:

答案 0 :(得分:1)

我看到的主要问题是您试图从原始类型访问不存在的属性。诸如number之类的原始类型没有像非原始对象一样可以访问的属性,因此:

total += parseInt(quantity.value * unit_price.value)将不起作用,因为quantity没有名为value的属性。对于unit_price变量也可以这样说。出于相同的原因,以下行将不起作用:total_price.value=total.value

另外,total_price在本地作用于函数updateCarteTotal,因此在程序运行期间不会保留任何值。您最好在任何单个函数的范围之外创建一个全局变量来存储购物车的总价值。