Question

Woocommerce 中的 Ajaxify 标题购物车项目计数

2018-07-01

38237

php jquery ajax wordpress woocommerce

我正在为 wordpress 创建自定义 woocommerce 集成主题。

我在顶部有一个 blob，显示购物车中的商品总数，我想使用 Jquery 更新此 blob（无需重新加载页面）我能够通过获取 blob 中的当前数字并每次点击将其增加 +1 来增加商品数量，问题是添加到购物车有一个选项可以选择要添加到购物车的商品数量。因此，如果我选择 3 个项目并单击按钮，blob 只会增加 1。

我可以创建一种方法来从前端获取正在添加的商品数量，但我认为这是不必要的。我希望能够使用 jquery 从 PHP 会话中获取总数，以便每次单击添加项目或删除项目时，我都会从服务器动态获取当前数字。

到目前为止，我所做的是创建一个 reloadCart.php 文件来回显购物车总数，这里是代码

<?php
require('../../../wp-blog-header.php');
global $woocommerce;
echo $woocommerce->cart->get_cart_contents_count();
?>

当我访问此页面时，它会回显当前项目总数，但我无法从 jquery 获取此数据，距离我上次使用 AJAX 已经有一段时间了，而且我很长时间没有从事 Web 项目了，但就我记得的而言，我进行的 AJAX 调用是正确的。

我尝试使用 jquery 的 get() 和 post() 函数以及普通的 ajax() 函数，但似乎没有任何作用。有人能帮忙吗？

$(".ajax_add_to_cart").click(function () {
   /*$("#bag-total").html(function () {
        var bagTotal = parseInt($(this).html());
        return ++bagTotal;
    });*/
    alert('clicked');
    $.get("<?php echo get_template_directory_uri(); ?>/reloadCart.php", function(data){
        alert("Data: " + data);
    });
});

注释的行是我之前使用的，通过从前端获取当前购物车号来添加购物车总额。

任何帮助都将不胜感激。提前致谢！

Answer 1

您不应使用任何重新加载 来更新购物车内容计数...相反，您应该使用专用的 woocommerce_add_to_cart_fragments 操作挂钩，该挂钩由 Ajax 提供支持 。

1）要刷新的 HTML： 因此，首先在主题的 header.php 文件中，您需要将购物车计数嵌入具有定义的唯一 ID（或类）的特定 html 标记中，例如：

$items_count = WC()->cart->get_cart_contents_count(); 
?>
    <div id="mini-cart-count"><?php echo $items_count ? $items_count : '&nbsp;'; ?></div>
<?php

或：

$items_count = WC()->cart->get_cart_contents_count();

echo '<div id="mini-cart-count"><?php echo $items_count ? $items_count : '&nbsp;'; ?></div>';

2）代码：

add_filter( 'woocommerce_add_to_cart_fragments', 'wc_refresh_mini_cart_count');
function wc_refresh_mini_cart_count($fragments){
    ob_start();
    $items_count = WC()->cart->get_cart_contents_count();
    ?>
    <div id="mini-cart-count"><?php echo $items_count ? $items_count : '&nbsp;'; ?></div>
    <?php
        $fragments['#mini-cart-count'] = ob_get_clean();
    return $fragments;
}

如果您在 html 标记中使用类，则将 ['#mini-cart-count'] 替换为 ['.mini-cart-count'] 。此钩子还用于刷新迷你购物车内容。

代码位于您活动子主题（或主题）的 function.php 文件中，或任何插件文件中。

Since few years global $woocommerce; + $woocommerce->cart is outdated and replaced by WC()->cart to access WooCommerce cart object.

如果您需要 jQuery 强制刷新该计数，您可以尝试 wc_fragment_refresh 或 wc_fragments_refreshed 委托事件，例如：

$(document.body).trigger('wc_fragment_refresh');

或：

$(document.body).trigger('wc_fragments_refreshed');

Answer 2

对于任何想要适当的Ajax实施的人，这是functions.php

630359017

的方法。脚本文件（假设您已将脚本文件征询并将Ajax对象传递到脚本中。代码>

Answer 3

在 header.php 中或您想要显示计数的位置

<?php $items_count = WC()->cart->get_cart_contents_count();
  echo $items_count; //use this function for print the value of cart items count
?>