Javascript 如何获取数量框以更新总价

嗨，伙计们，我正在从头开始建立一个简单的电子商务网站，而不是使用Shopify，我已经制作了所有简单的前端部件，但是我似乎无法根据客户选择的产品数量得到更新的总价格

到目前为止，如果客户“添加到购物车”，那么购物车中的价格和总数将更新1，但如果他们想要选择2个或更多，它将不起作用，我想知道如何才能让它起作用

HTML:

因此，我再次尝试计算用户何时单击+添加更多产品削减，我希望价格更新为：因此，如果用户需要5种产品，它将执行5*565等操作

谢谢

当您单击“添加到购物车”时，没有任何内容检索当前数量，因此它始终是静态的。通过从“数量”输入框中检索值，您的数学计算将正常进行

currentItems=$（“input.input组字段[name='quantity']”）val（）


//当用户单击+或-
jQuery（文档）.ready（函数（）{
$（'[data quantity=“plus”]'）。单击（函数（e）{
e、 预防默认值（）；
fieldName=$（this.attr（'data-field'）；
var currentVal=parseInt（$（'input[name='+fieldName+']'）.val（））；
如果（！isNaN（currentVal））{
$（'input[name='+fieldName+']'）.val（currentVal+1）；
}否则{
$（'input[name='+fieldName+']'）.val（0）；
}
});
$（'[data quantity=“减去”]'）。单击（函数（e）{
e、 预防默认值（）；
fieldName=$（this.attr（'data-field'）；
var currentVal=parseInt（$（'input[name='+fieldName+']'）.val（））；
如果（！isNaN（currentVal）&¤tVal>0）{
$（'input[name='+fieldName+']'）.val（currentVal-1）；
}否则{
$（'input[name='+fieldName+']'）.val（0）；
}
});
});
//当用户单击“添加到购物车”时，将更新购物车中的总价和数量
var currentItems=0；
var cartPrice=565.00；
$（文档）.ready（函数（）{
$（“.add to cart”）。单击（函数（）{
currentItems=$（“input.input组字段[name='quantity']”）val（）；
var totalPrice=当前项目*价格；
$（“.cart-badge”）.text（当前项目）；
$（“.cartPrice”）.text（总价+“kr”）
});
});

添加到购物车//添加到购物车的按钮
//产品数量
-
+
< PARCH＝“CARTPRESS”＞0 Kr/P>//CART 中的数量问题，我无意冒犯，但如果您计划将您自己的电子商务平台导入生产，那么您应该考虑它是否能完成任务。如果某件看似琐碎的事情把你绊倒了，我会担心最终产品的可行性。作为一个练习，这很好，但要小心：）@zfrisch我100%同意你的观点，但这只是一个练习，我永远不会这样做：）我只是想学习一些javascript，所以我想我会这样做，但我在这一部分非常执着这是完美的，非常感谢你，帮了我一把lot@RonTheOld没问题！如果答案解决了您的问题，您可以单击左侧的绿色复选标记！我不想为此添加其他答案，因为它与此非常相似，但这里有一个使用函数的建议（非常类似于此，好答案+1）：
<button class="addcart btn btn-danger add-to-cart" type="button">Add to cart</button> //Button to add to cart 
<div class="input-group plus-minus-input"> //Quantity of product 
  <div class="input-group-button">
    <button class="button hollow circle1 btn btn-primary"
         data-field="quantity" data-quantity="minus" type="button">
      <i aria-hidden="true" class="fa fa-minus"></i>
    </button>
  </div>
  <input class="input-group-field" name="quantity" type="number" value="0">
  <div class="input-group-button">
    <button class="button hollow circle2 btn btn-primary"
         data-field="quantity" data-quantity="plus" type="button">
      <i aria-hidden="true" class="fa fa-plus"></i>
    </button>
  </div>
</div>
<p class="cartPrice">0.00 kr</p><input id="search-submit" type="submit"> //Quantity in cart 

//Quanity animation when the user clicks + or -
jQuery(document).ready(function(){ 
  $('[data-quantity="plus"]').click(function(e){
     e.preventDefault();
     fieldName = $(this).attr('data-field');
     var currentVal = parseInt($('input[name='+fieldName+']').val());
     if (!isNaN(currentVal)) {
        $('input[name='+fieldName+']').val(currentVal + 1);
     } else {
        $('input[name='+fieldName+']').val(0);
     }
   });
   $('[data-quantity="minus"]').click(function(e) {
     e.preventDefault();
     fieldName = $(this).attr('data-field');
     var currentVal = parseInt($('input[name='+fieldName+']').val());
     if (!isNaN(currentVal) && currentVal > 0) {
        $('input[name='+fieldName+']').val(currentVal - 1);
     } else {
        $('input[name='+fieldName+']').val(0);
     }
   });
});

//When the user clicks add to cart this will update the total price and the quantity in the cart 
var currentItems = 0;
var cartPrice = 565.00;
$(document).ready(function(){
  $(".add-to-cart").click(function(){
     currentItems++;
     var totalPrice = currentItems * cartPrice;
     $(".cart-badge").text(currentItems);
     $(".cartPrice").text(totalPrice + " kr")
  });
});