Question

我正在尝试使用PHP和AJAX创建一个电子商务网站，但似乎无法在商店视图中获取产品的ID。例如，我的商店有3个产品，它们的ID分别为1,2,3，现在单击“添加到购物车”按钮，我要获取ID。为此，我正在使用AJAX

我尝试了几种不同的方法，并且将下面的当前代码包括在内。问题是，当我单击“添加到购物车”按钮时，无论将哪个产品添加到购物车，它只会获取第一个产品的ID，即1。

echo "<div class='col-xl-3 col-lg-4 col-md-4 col-sm-6 col-xs-12'>
                                                    <div class='product-item'>
                                                        <div class='product-image-hover'>
                                                            <a href='product-details.php?id=$id' id='theLink' data-id='$id'>
                                                                <img class='primary-image' src='$realimg' alt=''>
                                                            </a><input type='text' class='hidden-id' value='$id' hidden>
                                                            <div class='product-hover'>
                                                                <button type='button' class='add-to-cart'><i class='icon icon-FullShoppingCart' ></i></button>
                                                                <a href='#'><i class='icon icon-Heart'></i></a>
                                                                <a href='#'><i class='icon icon-Help'></i></a>
                                                            </div>
                                                        </div>
                                                        <div class='product-text'>
                                                            <h4><a href='product-details.php?id=$id'>$name</a></h4>
                                                            <div class='product-price'><span>INR $price</span></div>
                                                        </div>
                                                    </div>
                                                </div>";

相同的Ajax低于

$('.add-to-cart').click(function() {
    var quantity = 1;
    var id = $('.hidden-id').val();
    alert("Product id is " + id + " and quantity is: " +quantity);
});

单击购物车上的按钮，输出为“产品ID为1，数量为1” 无论我单击哪个产品按钮，ID始终为1，如何解决此问题？

Answer 1

尝试在名为添加到购物车的按钮中添加一个名为：data-val的属性，并向带有 hidden-id 的文本中添加动态的 id 属性。如下所示。并在脚本中也使用该属性。

PHP

Runnable

JS

echo "<div class='col-xl-3 col-lg-4 col-md-4 col-sm-6 col-xs-12'> <div class='product-item'> <div class='product-image-hover'> <a href='product-details.php?id=$id' id='theLink' data-id='$id'> <img class='primary-image' alt='sss'> </a><input type='text' class='hidden-id' id='hidden_$id' value='$id' hidden> <div class='product-hover'> <button type='button' class='add-to-cart' data-val='$id'>Add to cart</button> <a href='#'><i class='icon icon-Heart'></i></a> <a href='#'><i class='icon icon-Help'></i></a> </div> </div> <div class='product-text'> <h4><a href='product-details.php?id=$id'>$name</a></h4> <div class='product-price'><span>INR $price</span></div> </div> </div> </div>";

无法使用AJAX提取不同产品的ID

1 个答案: