2

我正在从事小型电子商务，我正在尝试在将商品添加到购物车后立即更新购物车中的商品数量。

我确定我错过了一步，因为除非页面刷新，否则购物车不会更新。

div添加项目：

<div class="buy_button">
  <h2><a href="#" class="addtocart" id="<?php echo $item_id ?>">Add item</a></h2>
</div>

需要异步更新的 div：

<div id="cart">

//SQL query to get count of items in table

<h2><?php echo $item_count ?></h2>
</div>

.

$(function() {
$(".addtocart").click(function(){
var element = $(this);
var I = element.attr("id");
var info = 'id=' + I;
$.ajax({
type: "POST",
url: "ajax_add.php",
data: info,
});

return false;
});
});

这是ajax_add.php：

if($_POST['id']) {

//SQL query to save item in table 
//SQL query to count items in table

<div id="cart">
//SQL query to get count of items in table
    <h2><?php echo $item_count ?></h2>
</div>
}
4

2 回答 2

2

您必须对来自 AJAX 调用的响应做一些事情。

$(function() {
    $(".addtocart").click(function(){
        var element = $(this);
        var I = element.attr("id");
        var info = 'id=' + I;
        $.ajax({
            type: "POST",
            url: "ajax_add.php",
            data: info,
            success: function(response) {
                $("#cart").replaceWith(response);
            }
        });
        return false;
    });
});
于 2013-09-02T22:59:59.017 回答
1

首先，您的语法错误，应该在控制台中引发错误。

数据：信息，

您在传递给 ajax 方法的对象上有一个尾随逗号。

此外，您没有回调函数来处理数据。考虑到您提供的代码，您将更新计数：

$.ajax({
    type: "POST",
    url: "ajax_add.php",
    data: info,
    success: function (data) {
        $('#cart h2').text($(data).find('#cart h2').text());
    }
});

让 ajax_add.php 返回一个 json 对象或仅返回更新的计数值肯定会更好。

于 2013-09-02T23:00:10.913 回答