Question

我有一个主页，它显示数据库中的产品，我放置了一个添加到购物车按钮，当然会将每个特定产品添加到购物车。目前我在页面上显示了6个产品，但显然只有第一个产品可以添加到购物车中，其余产品都有一个不起作用的按钮。

经过研究，建议我们不能通过JavaScript多次使用相同的ID（我使用的是id =“add-to-cart”），这就是循环内部发生的事情，因此只有第一个项目有一个工作按钮

如何为while循环中的每个“添加到购物车”按钮生成特定ID，以及脚本如何识别或读取每个特定ID？我不是JavaScript专家。

                $result = mysqli_query($bd,$sql2);

            }

            if($result){                
            while($row=mysqli_fetch_array($result)){
            $prodID = $row["ID"];

            $prodname= $row["itemname"];
            $prodprice = $row["price"];

            ?>  

                        <h1 class="product"><?php echo $prodname; ?></h1>
                            <p>Price: <span class="price"><?php echo $prodprice; ?></span></p>
                            <br>
                            <a class="btn btn-default add-to-cart cartButtons" id="add-to-cart" input>Add to Cart</a>
                            <p class="info hidethis" style="color:red;"><strong>Item Added to Cart!</strong></p>

这是脚本：

$('#add-to-cart').on('click',function(){
    $(this).siblings('.info').fadeIn(700).fadeOut(1000);
    var price = $(this).siblings('p').children('.price').html();
    var product = $(this).siblings('.product').html();
    $.post('cart/data.php?q=addtocart',
           {
                price:price,
                product:product,
                qty:1
           }
    );
});

Answer 1

根据您的示例，删除id="add-to-cart"，然后像这样调整jquery点击：

$('.add-to-cart').on('click',function(){ ... });

这会将click事件设置为所有设置为类add-to-cart的按钮。由于您已经在点击事件功能中使用了$(this)，因此它已经从该点击中提取详细信息，而不是其他人。

如何对循环内的按钮使用相同的功能？

1 个答案: