Javascript 购物车中的加号/减号按钮间歇性显示

在完成了让AJAX add to cart为可变产品工作的步骤之后，我遇到了一个问题，在我（成功）向购物车添加一个项目之后，购物车会动态刷新，数量+/-按钮不会显示（不隐藏，但不会呈现）。数量值显示，但不显示通常位于其旁边的按钮

奇怪的是，如果我刷新页面（此时页面正常加载，而不是通过get_refresh_片段加载），按钮会重新出现。有什么想法可以导致这种行为吗

解决方案

感谢@dingo_d的贡献，这很容易理解。我不知道WC删除了数量按钮，这自然指向主题-在本例中是Avada-它在main.js底部插入了一个代码块来重新添加按钮。该块只在加载时运行，不使用AJAX重新加载，在cart refre之后没有数量按钮上海

---

我只是将它分解成一个单独的函数，并在片段刷新后手动调用它。

我不知道您是使用自定义模板文件（您在主题中有woocommerce文件夹），还是仅使用普通的woocommerce+钩子作为外观，而是使用新的woocommerce（来自版本2.3 iirc）移除了单件产品上的+/-按钮

我从呈现旧按钮的旧模板中提取了一些jquery代码，并将其用于我的主题：

// Input +- tweak

$(function(a){
a(".woocommerce-ordering").on("change", "select.orderby", function(){
    a(this).closest("form").submit();
}),
a("div.quantity:not(.buttons_added), td.quantity:not(.buttons_added)").addClass("buttons_added").append('<input type="button" value="+" class="plus" />').prepend('<input type="button" value="-" class="minus" />'), a("input.qty:not(.product-quantity input.qty)").each(function(){
    var b=parseFloat(a(this).attr("min"));b&&b>0&&parseFloat(a(this).val())<b&&a(this).val(b);
}),
a(document).on("click", ".plus, .minus", function(){
    var b=a(this).closest(".quantity").find(".qty"),
    c=parseFloat(b.val()),
    d=parseFloat(b.attr("max")),
    e=parseFloat(b.attr("min")),
    f=b.attr("step");c&&""!==c&&"NaN"!==c||(c=0),
    (""===d||"NaN"===d)&&(d=""),
    (""===e||"NaN"===e)&&(e=0),
    ("any"===f||""===f||void 0===f||"NaN"===parseFloat(f))&&(f=1),
    a(this).is(".plus")?b.val(d&&(d==c||c>d)?d:c+parseFloat(f)):e&&(e==c||e>c)?b.val(e):c>0&&b.val(c-parseFloat(f)),
    b.trigger("change");
    });
});

//输入+-调整
$（功能（a）{
a（“.woodcommerce ordering”）.on（“change”、“select.orderby”、function（）{
a（本）最接近的（“表格”）.submit（）；
}),
a（“div.quantity:not（.buttons_added）、td.quantity:not（.buttons_added）”）.addClass（“buttons_added”）.append（“”）.prepend（“”）、a（“input.qty:not（.product quantity input.qty）”）。每个（函数（）{
var b=parseFloat（a（this.attr（“min”）；b&&b>0&&parseFloat（a（this.val（））d）？d:c+parseFloat（f））：e&&e==c|e>c）？b.val（e）：c>0&&b.val（c-parseFloat（f）），
b、 触发（“变更”）；
});
});

这将在数量一侧添加+/-按钮

现在，如果你的主题里面有模板文件，这些按钮是硬编码的，那么你需要查看它们的类，并试图找到控制它们的代码

---

希望这能有所帮助。

要解决上述问题，只需将ajaxComplete函数添加到themes functions.php中即可

    var cartUpdateStart=false;

    jQuery( document ).ajaxComplete(function() {

        if(cartUpdateStart){

            addPlusMinusIcons();

            cartUpdateStart=false;

        }

    });

将下面的脚本添加到子主题script.js

var aObj

函数addPlusMinusIcons（）{

console.log（'executing'）；
aObj（“.woocommerce ordering”）.on（“change”、“select.orderby”、function（）{
aObj（this）.closest（“表单”）.submit（）
})，aObj（“div.quantity:not（.buttons\u added）”），td.quantity:not（.buttons\u added）”）.addClass（“buttons\u added”）.append（“”）.prepend（“”），aObj（“input.qty:not（.product quantity input.qty）”）。每个（函数（）{
var b=parseFloat（aObj（this.attr（“min”））；
b&&b>0&&parseFloat（aObj（this.val（））d）？d:c+parseFloat（f））：e&（e==c | e>c）？b.val（e）：c>0&&b.val（c-parseFloat（f）），b.trigger（“更改”）
})
}
jQuery（函数（a）{
aObj=a；
addPlusMinusIcons（）；
}); 

console.log('executing');

aObj(".woocommerce-ordering").on("change", "select.orderby", function() {

    aObj(this).closest("form").submit()

}), aObj("div.quantity:not(.buttons_added), td.quantity:not(.buttons_added)").addClass("buttons_added").append('<span class="minus"><i class="fa fa-minus" aria-hidden="true"></i></span>').prepend('<span class="plus"><i class="fa fa-plus" aria-hidden="true"></i></span>'), aObj("input.qty:not(.product-quantity input.qty)").each(function() {

    var b = parseFloat(aObj(this).attr("min"));

    b && b > 0 && parseFloat(aObj(this).val()) < b && aObj(this).val(b)

}), aObj(document).on("click", ".plus, .minus", function() {  
    var b = aObj(this).closest(".quantity").find(".qty"), c = parseFloat(b.val()), d = parseFloat(b.attr("max")), e = parseFloat(b.attr("min")), f = b.attr("step");

    c && "" !== c && "NaN" !== c || ( c = 0), ("" === d || "NaN" === d) && ( d = ""), ("" === e || "NaN" === e) && ( e = 0), ("any" === f || "" === f ||

    void 0 === f || "NaN" === parseFloat(f)) && ( f = 1), aObj(this).is(".plus") ? b.val(d && (d == c || c > d) ? d : c + parseFloat(f)) : e && (e == c || e > c) ? b.val(e) : c > 0 && b.val(c - parseFloat(f)), b.trigger("change")

})
}

jQuery(function(a) {
   aObj=a;
   addPlusMinusIcons();
});