【问题标题】:TypeError: $ is not a function WordPressTypeError:$ 不是 WordPress 的函数
【发布时间】:2012-08-28 19:20:46
【问题描述】:

我购买的主题中的.js 文档可能有错误:

$('.tagcloud a').wrap('<span class="st_tag" />');

我正在尝试解决它,但我不是程序员,所以我不知道如何解决。 网站是这样的:http://www.framerental.com

【问题讨论】:

  • 老实说,如果您已经为主题付费并且您没有对您的网站进行很多其他自定义(因为您毕竟不是程序员)我会联系他们的支持
  • 在我看来,我现在可以在较新版本的 wp 中使用 $fine

标签: javascript jquery wordpress


【解决方案1】:

jQuery 可能会丢失。

&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"&gt;&lt;/script&gt;

【讨论】:

  • 这是可能的,但 wordpress 和大多数 CMS 默认情况下没有设置 $。
【解决方案2】:

如果你已经包含了 jQuery,可能会有冲突。尝试使用jQuery 而不是$

【讨论】:

    【解决方案3】:

    你使用jQuery.noConflict(); 所以$ 是未定义的。

    您可以在此处阅读更多信息docs

    尝试用这种方式修改你的代码(在准备函数中添加$符号):

    jQuery(document).ready(function($) {
        // Code that uses jQuery's $ can follow here.
    });
    

    【讨论】:

    • 好的!现在有些工作,但出现了其他错误: Referenceerror resiza window is not defined。行:jQuery(window).bind("resize", resizeWindow);函数 resizeWindow( e ) { var newWindowWidth = jQuery(window).width();
    • 尝试在绑定表达式之前定义函数。
    • 在我注释掉主题的旧“排队”jQuery 之后,这修复了我使用旧 WP 主题的所有错误。坦率地说,我发现“wp_enqueue_script”系统真的很烦人、做作、过于复杂和不必要。我希望 WordPress 能够为管理面板隐藏/划分自己的 js 代码,并让我们以我们想要的方式使用 jQuery。 “wp_enqueue_script”是否通过了 Google PageSpeed Insight 测试?可能不是。或者只是要求所有 WP 插件和主题使用相同的 jQuery——然后每个人都会在同一个页面上,我们可以一起前进。
    • 我也与 WP 的 enqueue 方法进行了斗争,但现在已经接受了它。它保持最佳实践,您只需在模板中添加带有链接标签的脚本,就可以很容易地忽略它。 WP enqueue 的 jQuery 自动,所以你必须使用 dequeue。 WP 还具有本地化功能,在结合脚本以提高页面速度方面值得研究。
    • 这应该是公认的答案。唯一对我有用的东西!
    【解决方案4】:

    要么你不包括 jquery toolkit/lib,正如一些人所建议的那样,要么存在某种冲突。测试:包括 jQuery 并像这样测试:

    console.log($);
    console.log($ === jQuery);
    

    如果$ 不是未定义的,并且$ === jQuery 记录为false,那么您肯定会遇到冲突。用jQuery 替换你的$ 可以解决这个问题,但这可能非常乏味(所有额外的输入......)。通常我以$jq = _$ = jQuery; 开始我的脚本,以至少对jQuery 对象有一个更短的引用。
    当然,在您这样做之前,请检查您是否不小心覆盖了预先设置的变量:console.log($jq, _jQ, _$);not 为准课程

    【讨论】:

    • Elias 你似乎有答案,但只要我不是程序员,我觉得你在用中文说话。对我来说有什么简单的解决方案吗?我完全迷路了:-(
    • @user1645326:是的,有。您在 jurka 答案下方的评论告诉我,您要么没有在包装器 jQuery(document).ready(function($){ 函数中编写所有 jQ 代码,而是应该这样做。此外,resizeWindow 应该从 $(this).width(); 而不是 jQuery(window).with(); 获得它,但也许最重要的是:错误说明了一切:您的代码中有一个错字:只需在您的代码中搜索 resiza window,并将其替换为resizeWindow...
    【解决方案5】:

    功能错误在几乎所有内容管理系统中都很常见,有几种方法可以解决此问题。

    1. 使用以下方法包装您的代码:

      <script> 
      jQuery(function($) {
      
      YOUR CODE GOES HERE
      
      });
      </script>
      
    2. 你也可以通过noConflict();来使用jQuery的API

      <script>
      $.noConflict();
      jQuery( document ).ready(function( $ ) {
      // Code that uses jQuery's $ can follow here.
      });
      // Code that uses other library's $ can follow here.
      </script>
      
    3. 另一个使用 noConflict 而不使用 document ready 的例子:

      <script>
      jQuery.noConflict();
          (function( $ ) {
              $(function() { 
                  // YOUR CODE HERE
              });
           });
      </script>
      
    4. 您甚至可以选择创建自己的别名以避免这样的冲突:

      var jExample = jQuery.noConflict();
      // Do something with jQuery
      jExample( "div p" ).hide();
      
    5. 另一个更长的解决方案是将 $ 的所有引用重命名为 jQuery:

      $( "div p" ).hide();jQuery( "div p" ).hide();

    【讨论】:

      【解决方案6】:

      只需添加这个:

      <script>
      var $ = jQuery.noConflict();
      </script>
      

      到 header.php 中的 head 标签。或者,如果您想在管理区域(或不使用 header.php 的地方)中使用美元符号,就在您要使用它的地方之前。

      (可能存在一些我不知道的冲突,请对其进行测试,如果有,请使用此处或以下链接提供的其他解决方案。)

      来源:http://www.wpdevsolutions.com/use-the-dollar-sign-in-wordpress-instead-of-jquery/

      【讨论】:

      • 如果您将自己的自定义主题脚本排入页脚,则此方法有效。
      【解决方案7】:

      不要这样做:

      $(document).ready(function() { });
      

      你应该这样做:

      jQuery(document).ready(function($) {
      
          // your code goes here
      
      });
      

      这是因为 WordPress 可能在将来或现在将 $ 用于 jQuery 以外的其他东西,因此您需要以 $ 只能在 jQuery 文档就绪回调中使用的方式加载 jQuery。

      【讨论】:

      • 这适用于 doc.ready 中的任何内容。如果您想要全面(窗口功能),请查看上面 Savage 的答案。
      【解决方案8】:

      我添加了一个在head 部分末尾加载的自定义脚本文件,并在顶部插入了以下内容:

      (function (jQuery) {
          window.$ = jQuery.noConflict();
      })(jQuery);
      

      (这是对 Fanky 答案的修改)

      【讨论】:

        【解决方案9】:

        除了 noConflict,这也很有帮助:

        (function( $ ) {
            // Variables and DOM Caching using $.
            var body = $('body');
            console.log(body);
        })( jQuery );
        

        【讨论】:

          【解决方案10】:

          我能够很容易地解决这个我简单的排队 jQuery wp_enqueue_script("jquery");

          【讨论】:

            【解决方案11】:

            有一种简单的方法可以修复它。只需安装 plugin 并激活它。更多信息:https://www.aitlp.com/wordpress-5-3-is-not-a-function-fix/.

            使用 Wordpress 5.3 版测试。

            【讨论】:

              【解决方案12】:

              我在 WordPress 网站中遇到了与 jquery 相同的问题,我通过重新排列脚本解决了这个问题。

              如果 aowl 首先在我的网站中加载,那么我会在问题中提及错误。

              并确保 jquery 在 aowl carousel 脚本之前首先加载,然后添加下面的代码,错误不应出现。希望它可以在将来对某人有所帮助。

                jQuery(document).ready(function($) {
                      // Code that uses jQuery's $ can follow here.
                  });
              

              【讨论】:

              • VsCode 告诉我们上面的代码从 3.0 开始就被弃用了。它推荐使用 jQuery(function() { })
              猜你喜欢
              • 2013-08-13
              • 1970-01-01
              • 2018-01-02
              • 2020-06-29
              • 2020-06-17
              • 1970-01-01
              • 1970-01-01
              • 2020-03-03
              • 2013-07-21
              相关资源
              最近更新 更多