Question

我有一个购物车页面，页面上的每个项目都有一个加号减号按钮。

当我点击第一项加号/减号按钮时它工作正常，但当我点击第二项按钮时，按钮工作，它改变了第一项数量输入的数量，并且不更新第一项的数量或第二项但仅更改数字。

CODE

<iframe name="quantity" style="display:none;"></iframe>

<form action="checkout_qty_update.php" method="post" target="quantity">
<input type="hidden" value="<?php echo $prITTD; ?>" name="hiddenID">
<input style="font-size:21px;" type="submit" value="-" onclick='javascript: subtractQty();' class="minus">
<input id="number" type="number" value="<?php echo $qtyT; ?>" class="qty" name="picpac"/>
<input style="font-size:21px;" type="submit" value="+"  onclick='javascript: document.getElementById("number").value++;' class="plus">
</form>

JS for plus / minus

function subtractQty(){
    if(document.getElementById("number").value - 1 < 1)
return;
    else
 document.getElementById("number").value--;
}

Answer 1

如何使用加减按钮自动计算价格：

function cartElement($productimg, $productname, $productColor, $productprice, $productid){
$element = "

<form action=\"cart.php?action=remove&id=$productid\" method=\"post\" class=\"cart-items\">
                <div class=\"border rounded\">
                    <div class=\"row bg-white\">
                        <div class=\"col-md-3 pl-0\">
                            <img src=$productimg alt=\"Image1\" class=\"img-fluid\">
                        </div>
                        <div class=\"col-md-6\">
                            <h5 class=\"pt-2\">$productname</h5>
                            <small class=\"pt-2\">$productColor</small>
                            <h5 class=\"pt-2\">$$productprice</h5>
                            <button type=\"submit\" class=\"btn btn-warning\">Save for Later</button>
                            <button type=\"submit\" class=\"btn btn-danger mx-2\" name=\"remove\">Remove</button>
                        </div>
                        <div class=\"col-md-3 py-5\">
                            <div>
                                <button type=\"button\" class=\"btn bg-light border rounded-circle\"><i class=\"fas fa-minus\"></i></button>
                                <input type=\"text\" value=\"1\" class=\"form-control w-25 d-inline\">
                                <button type=\"button\" class=\"btn bg-light border rounded-circle\"><i class=\"fas fa-plus\"></i></button>
                            </div>
                        </div>
                    </div>
                </div>
            </form>

";
echo  $element;
}

Answer 2

我非常确定这是因为您的所有输入类型编号都具有相同的ID number。

尝试更改您的HTML代码

<form action="checkout_qty_update.php" method="post" target="quantity">
  <input type="hidden" value="<?php echo $prITTD; ?>" name="hiddenID">
  <input [...] onclick="javascript: subtractQty('<?php echo $prITTD; ?>');" >
  <input [...] id="number_<?php echo $prITTD; ?>" />
  <input [...] onclick="javascript: document.getElementById('number_<?php echo $prITTD; ?>').value++;">
</form>

你的JS代码

function subtractQty(prITTD){
  var pr = document.getElementById("number_" + prITTD);
  if (pr.value - 1 < 1)
    return;
  else
    pr.value--;
}

PHP加号/减号按钮无法正常工作

2 个答案: