将 12 件产品添加到购物车

设计师

您好,我的代码有问题,我想做同样的事情,但使用 12 的倍数而不是数字 12

例如 12 瓶啤酒、24 瓶啤酒等,但不是 13、14 或 15 瓶啤酒。

抱歉,我的英语很不好。

https://bcambre-eshop.webflow.io/test

谢谢

<script>
// Initialize texts
$(".beer-info").hide();
$(".beer-info-alt").hide();
$(".checkout-abs").hide();
// select the target node — here : .cart-list
var target = document.getElementById('target');
// input here your reference value
var targetQty = 12;
// create an observer instance
var observer = new MutationObserver(function (mutations) {
    mutations.forEach(function (mutation) {
        //console.log('cart update'); 
        setTimeout(function(){    
        var currentQty = $('.w-commerce-commercecartopenlinkcount').text();
        var leftQty = targetQty - currentQty ;
        // update counter — console.log('cans missing' + ' ' + leftQty);
            if ( leftQty <= 0 ) {
                $(".beers-left").text(leftQty);
                $(".beer-info").hide();
                $(".beer-info-alt").show();
                $(".checkout-abs").show();
            }
            else {
                    $(".beer-info-alt").hide();
                $(".checkout-abs").hide();
                    $(".beer-info").show();
                $(".beers-left").text(leftQty);  
            }
        // update progression stackbar — console.log(progressBar);
        var progressBar = currentQty / targetQty * 100;
        $(".completed-bar").css('width', progressBar + '%');      
    }, 300);
    });
});
// configuration of the observer:
var config = {
    attributes: false,
    childList: true,
    characterData: false
};
// pass in the target node, as well as the observer options
observer.observe(target, config);
</script>

打开
var leftQty = targetQty - (currentQty % targetQuantity);

模数运算符%将给您当前数量除以目标数量后的余数。然后,您可以从 targetQuantity 中减去该值,以得出一包能容纳多少啤酒。

1 % 12 = 1
    12 - 1 = 11 beers remaining in a 12 pack

13 % 12 = 1
    12 - 1 = 11 beers remaining in a 24 pack

25 % 12 = 1
    12 - 1 = 11 beers remaining in a 36 pack

等等

您可以在进度指示器旁边显示当前的包数量。

var totalPacks = Math.ceil(currentQuantity/targetQuantity)

You have {leftQty} beers of pack {totalPacks}

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

将产品添加到购物车WooCommerce?

使用php将产品添加到购物车后如何更改添加到购物车按钮

添加产品时,WooCommerce将加售产品添加到购物车

根据Woocommerce中的其他购物车数量自动将特定产品添加到购物车

Laravel将具有相同产品的购物车按钮添加到+1数量的购物车中

将产品添加到购物车时自动添加包装WooCommerce Multisite

将产品成功添加到购物车后,如何添加ajax通知

自动将产品添加到购物车WooCommerce时,排除某些类别

Magento将最新产品添加到购物车

Woocommerce-在页面加载时,将产品添加到购物车并自动进行结帐

将Woocommerce的“添加到购物车”按钮更改为“查看产品”按钮

将产品添加到购物车无法正常工作

在WooCommerce中以编程方式自动将礼品产品添加到购物车?

从WooCommerce中的WP管理员将产品添加到客户的购物车

Magento无法将所有其他产品添加到购物车

使用自定义信息和价格将产品添加到购物车

Magento Soap API将捆绑产品添加到购物车

虚拟属性未设置为将产品添加到购物车的实例

将产品添加到Prestashop 1.6中特定商店的购物车中(以编程方式)

在Woocommerce 3中自动将产品添加到购物车

Redux + React Native将产品添加到购物车不起作用

React Redux,尝试将产品添加到购物车

根据范围条件自动将产品添加到 WooCommerce 购物车

Sylius ShopApiPlugin无法将产品添加到购物车

将每种产品添加到购物车后,update_checkout

在将产品添加到购物车之前,需要Woocommerce复选框

WooCommerce:如何以编程方式将许多产品添加到购物车?

Woocommerce结帐:将产品添加到购物车的复选框

将产品添加到购物车jQuery / Ajax / Symfony / Twig