WooCommerce 双重加载答案

【问题标题】：WooCommerce double loadWooCommerce 双重加载
【发布时间】：2013-10-03 13:08:20
【问题描述】：

我有这个Wordpress project，我正在使用WooCommerce Plug-in 和WooCommerce Adamas Theme。我有以下问题：

作为我项目的一部分，我需要将右上角菜单中的“购物车”一词替换为购物车图标。我的主题在其functions.php 文件中所做的是创建两个a 链接到购物车的内容PoP Up 元素。第一个是“购物车”一词，第二个是购物车产品柜台。

我尝试通过将 cmagnet-cart 类添加到第二个来添加以下 CSS 属性，以包含购物车图标。

.cmagnet-cart{
    background: url('http://www.athlokinisi.gr/images/shopping-cart.png') no-repeat 10px 6px;
    min-width: 45px;
    text-align: right;
    background-size: auto 17px;
}

我已将该类添加到最初生成它的functions.php cartShow() function 的适当元素中。如您所见，问题在于当页面加载时，它会在位置上完美显示图标，然后会重新加载一些 WooCommerce 参数并通过返回其原始值再次隐藏它。因此，没有我添加的课程。

在与 PremiumCoding 的 Adamas 主题支持团队联系并在 2 周多的时间里发生了几张票后，有人向我指出我需要对 WooCommerce 的 JS 功能进行更改，也许是 cart-fragment.js。问题是那里对我来说没有任何意义，我真的找不到在哪里进行代码更改，以便 Javascript 的第二次加载包含我的函数或从双重加载中排除这个元素。那里的支持团队无法进一步帮助我。

我将不胜感激任何帮助以及为什么会发生这种情况的解释。为什么要加载某些元素两次对我来说没有任何意义。

添加两个附加信息： - 我知道当我解决问题时，我将隐藏（可能通过放入 cmets）第一个打印“购物车”一词的a 链接 - 我从支持部门得到的最后回复如下（如果有帮助的话）：

即使您在加载 WooCommerce Ajax 后将文本替换为图标，文字会回来。所以你需要改变 WooCommerce js 功能或使用 WPML 插件翻译所有 WooCommerce 插件和主题字符串翻译模块。

扩展信息： 一般来说，我只用购物车的图片替换第一个显示“购物车”的a 链接是不够的，因为它不能解决我更大的问题，其中包括以下内容：我在这个项目中使用希腊语和主题有很多uppercase CSS 元素。这样做有一些问题，因为大写的希腊词无法自动转换，因为您必须从元音中删除重音。因此，我制作了一个 jQuery 函数，它可以在文档就绪上运行并纠正这个问题，但是由于前面提到的双重加载问题，它会将所有文本返回到之前的状态。

【问题讨论】：

标签： javascript jquery ajax wordpress woocommerce

【解决方案1】：

我通过添加以下代码解决了它：

//Uppercase correction for Greek language
    String.prototype.replaceArray = function(find, replace){
        var replaceString = this;
        for (var i = 0; i < find.length; i++){
            replaceString = replaceString.replace(find[i], replace[i]);
        }
        return replaceString;
    };
    var e = jQuery('a, h2, h3, button, li'), l = e.length, i;
    if (typeof getComputedStyle == "undefined"){
        getComputedStyle = function(e) {return e.currentStyle;};
    }

    for (i=0; i<l; i++){
        if (getComputedStyle(e[i]).textTransform == "uppercase"){
            var find = ['ά', 'έ', 'ί', 'ή', 'ύ', 'ό', 'ώ'];
            var replace = ['α', 'ε', 'ι', 'η', 'υ', 'ο', 'ω'];
            var replaceTo = e[i].innerHTML;
            replaceTo = replaceTo.replaceArray(find, replace);
            e[i].innerHTML = replaceTo;
        }
    }
    //Uppercase correction for Greek language

进入文件：

wp-content/plugins/woocommerce/assets/js/frontend/cart-fragments.min.js

这个JS 文件是造成内容双重加载的原因。它可能不是最好的解决方案，但却是一个可行的解决方案。

【讨论】：