WooCommerce - 允许客户更改默认添加到卡的数量答案

【问题标题】：WooCommerce - Allow customer to change default add-to-card quantityWooCommerce - 允许客户更改默认添加到卡的数量
【发布时间】：2020-05-04 09:59:30
【问题描述】：

我正在管理一个网上商店，您可以在其中购买功能食品。在网站上，我缺少客户可以预先输入他们想要食物的客人数量的功能。然后当客户从那时起将产品添加到卡中时，这是定义的数量。我在 Wordpress 中使用 Woocommerce。有没有简单的解决方案或现有的 Wordpress 插件？

【问题讨论】：

标签： wordpress woocommerce webshop

【解决方案1】：

我自己解决了这个问题。如果有人发现自己有同样的问题。那么这里就是答案。找到了一个解决方案，使用 js 然后 css 输入字段。

我也在 js 中实现了 min.允许的数量是 8 并且使用 css，如果数量 i 低于 8，则输入字段将被标记为红色。

var numberOfEnvelopes = localStorage.getItem('numberOfEnvelopes');
    if(numberOfEnvelopes != null) {
        changeQuantityWoo();
        document.querySelector('input[name="envelopes"]').value = localStorage.getItem('numberOfEnvelopes');
    } else {
		localStorage.setItem('numberOfEnvelopes', 8);
	}
    document.querySelector('input[name="envelopes"]').addEventListener("input", function() {
         console.log(this.value);
        // Save to localstorage.
		if(this.value >= 8 ) {
			localStorage.setItem('numberOfEnvelopes', this.value);
        	changeQuantityWoo();
		}
    });
    // change woocommerce add to cart buttons
    function changeQuantityWoo() {
        let btns = document.querySelectorAll('a[data-quantity]');
        btns.forEach( function(event) {
            event.dataset.quantity = localStorage.getItem('numberOfEnvelopes');
        });
    }

/*Qty field*/
input[name="envelopes"]:invalid {
	color: red;
	border-color: red;
}

【讨论】：