Uncaught TypeError: jQuery(...).each is not a function after update wordpress theme

Posted 2023-05-09

【中文标题】Uncaught TypeError: jQuery(...).each is not a function after update wordpress theme

【英文标题】：Uncaught TypeError: jQuery(...).each is not a function after updating wordpress theme

【发布时间】：2021-11-22 17:38:50

【问题描述】：

我正在使用 wordpress 主题“Divi”。更新后，我添加到页脚模板中的一些自定义 jQuery 已经坏了，我不知道如何让它再次工作。

这是我的页脚模板中的内容：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
(function($)
    jQuery('[id=beer_right]').each(function()  
        var text = (jQuery(this).text());  
        console.log(text);
        var substring = text.substring(1,3);
        var substring100 = text.substring(1,4);
            if(substring100 == "100")
            jQuery(this).addClass('full')
        else if (substring >= 60 && substring <= 99)
                jQuery(this).addClass('full')
        else if(substring >= 30 && substring <= 59)
            jQuery(this).addClass('half')
        else
            jQuery(this).addClass('empty')
        
    );
    jQuery("[id=bottle_right]").each(function()  
        var text2 = (jQuery(this).text());  
        var substring2 = text2.substring(2,4);
        //console.log(substring2);
            if(substring2 == "17" || substring2 == "16" || substring2 == "15" || substring2 == "14" || substring2 == "13" || substring2 == "12" || substring2 == "11" || substring2 == "10" || substring2 == "9%")
                jQuery(this).addClass('strong')
        else if(substring2 == "8%" || substring2 == "7%" || substring2 == "6%")
            jQuery(this).addClass('average')
        else
            jQuery(this).addClass('light')
        
    )
     if (jQuery('.app-link').length)
            if(navigator.userAgent.toLowerCase().indexOf("android") > -1)
            var applink = jQuery('.app-link');
            applink.attr("href", "https://play.google.com/store/apps/details?id=com.AuphanSoftware.OftenDining");
            
            if(navigator.userAgent.toLowerCase().indexOf("iphone") > -1)
            var applink = jQuery('.app-link');
            applink.attr("href", "https://itunes.apple.com/us/app/often-dining/id608504639?mt=8")
             
     

)(jQuery); 
</script>




<script>
(function($)
    if (jQuery(window).width() < 585) 
        jQuery('.et_pb_tabs_controls > li').click(function() 
            jQuery('html, body').animate(
                    scrollTop: jQuery(".et_pb_all_tabs").offset().top
                , 2000);
        );
        
)(jQuery);

</script>

我在控制台中遇到的错误是：

(index):5831 Uncaught TypeError: jQuery(...).each is not a function

(index):5877 Uncaught TypeError: jQuery(...).width is not a function

网址是：https://sdtaproom.com/beer

【问题讨论】：

你有 (function($) ... )(jQuery) 的 IIFE 包装器。因此，您应该在这些函数中使用$，而不是jQuery，如(function($) ... $() ... )(jQuery)。

@Ouroborus 如果我执行上述操作，那么我会在控制台中收到此错误：$(...).each 不是函数

您知道，您仍然应该根据我给出的原因进行更改。

【参考方案1】：

您是否从 wp 中删除了 jquery？ 如果没有，你不需要在函数之前进行这个调用>()

函数是正确的，并且在控制台中工作，错误是由于正在加载的jquery的加载生命周期。

对不起我的英语

【讨论】：

我自己没有做任何事情来从 wp.xml 中删除 jquery。您是指在我的脚本标签之前添加 jquery 库吗？如果是这样，我已尝试删除 jquery 库，但我仍然在控制台中收到相同的错误。但是我拥有的功能确实在控制台本身内工作。所以我相信 JQuery 库发生了一些事情。我只是不确定它到底是什么以及如何处理它

【参考方案2】：

想通了。我正在使用聚合 JS 的插件“自动优化”。我关闭了它，它现在可以工作了