Question

我正在建立一个电子商务网站。

我的问题是，当客户点击产品时，如何将该产品的所有数据（ID，名称，价格）保存在javascript对象中，然后使用选择的产品对象数组发送到PHP文件Ajax的？

这是我目前的实施：

  <?php 
while($row=mysqli_fetch_assoc($product))
{
    $id=$row['id'];
    $name=$row['name'];
    $price=$row['price'];
?>
<div class="product" onclick="getProduct(this)">
    <p data-pid="<?php echo $id ?>" ><?php echo $id ?></p>
    <p data-pname="<?php echo $name ?>"><?php echo $name ?></p>
    <div class="product-footer">
        <p data-pprice="<?php echo $price ?>"><?php echo $price ?></p>
        <button>Add To Cart</button>
    </div>
</div>
<?php
}
?>

JS代码：

var products = new Array();
var product= new Object();
function getProduct(obj) {
     product.id = $(obj+' [data-pid]').data('pid');
     product.name= $(obj+' [data-pname]').data('pname');
     product.price= $(obj+' [data-pprice]').data('price');
     products.push(product);
     console.log(products);
}

这个实现不起作用我得到这个javsscript错误

未捕获的ReferenceError：未定义getProduct 在HTMLButtonElement.onclick

Answer 1

就这样做

     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> //Jquery Plugin

     <?php 
        while($row=mysqli_fetch_assoc($product)){echo '
        <div class="product" data-id="'.$row['id'].'" data-name="'.$row['name'].'" data-price="'.$row['price'].'">
            <p>'.$row['id'].'</p>
            <p>'.$row['name'].'</p>
            <div class="product-footer"><p>'.$row['price'].'</p><button>Add To Cart</button></div>
        </div>';
        }
    ?>
    <script>
    $('.product').click(function(e) {
        product = {'id':$(this).data('id'),'name':$(this).data('name'),'price':$(this).data('price')};
        console.log(product);
    });
    </script>

未捕获的ReferenceError：未在HTMLButtonElement.onclick中定义getProduct

1 个答案: