jQuery 未在 Wordpress 中定义，但我的脚本已正确排队

Question

我正在尝试将单独的 javascript 文件 mobile-menu.js 加载到我的 Wordpress 主题。当我查看控制台时，它显示 "jQuery is not defined." 但是，我知道我已将脚本文件正确排队。有任何想法吗？

HTML 文件:

<a href="#" id="menu-icon"></a> <!--this line wasn't here originally-->
    <div id="switchmenu"><!--switchmenu begin-->
        <?php wp_nav_menu( array( 'theme_location' => 'primary' ) ); ?>
    </div><!--switchmenu end-->

functions.php 文件:

function lapetitefrog_scripts() {
    wp_enqueue_style( 'lapetitefrog-style', get_stylesheet_uri() );
    wp_enqueue_script( 'lapetitefrog-mobile-menu', get_template_directory_uri() . '/js/mobile-menu.js', array(), '1.0', true );
}
add_action( 'wp_enqueue_scripts', 'lapetitefrog_scripts' );

手机-menu.js 文件：

 jQuery(document).ready(function($) {
    $('#menu-icon').click(function() {
            $('#switchmenu').slideToggle("fast");
    });
});

Answer 1

首先确保 jquery 文件包含在 header 中，并且您的文件需要 jQuery

wp_enqueue_script( 
        'lapetitefrog-mobile-menu', 
        get_template_directory_uri() . '/js/mobile-menu.js', 
        array('jquery'), 
        '1.0', 
        true 
);

其次，您应该像这样启动 javascript 文件：

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

或

// Use jQuery in place of $
jQuery(document).ready(function() {
    .....
});

Answer 2

Wordpress 默认附带 jQuery

// Adds jQuery
    add_action('init', 'childoftwentyeleven_down');

        function childoftwentyeleven_down() {

          // register your script location, dependencies and version
                wp_register_script('down',
                    get_stylesheet_directory_uri() . '/js/down.js',
                    array('jquery') );
           // enqueue the script
           wp_enqueue_script('down');

        }

Answer 3

在将脚本加入队列之前添加 wp_enqueue_script('jquery');。

Answer 4

你可以试试：

首先入队 Jquery。

wp_enqueue_script('jquery');

然后在第三个参数中使用 JQuery 依赖项 将后一个脚本排入队列，即 array('jquery') 大多数人都忘记了。

wp_enqueue_script( 'lapetitefrog-mobile-menu', get_template_directory_uri() . '/js/mobile-menu.js', array('jquery'), '1.0', true );

Answer 5

错误 jQuery is not defined 也可能出现在模板部件中嵌入的 jQuery 代码中。

当 jQuery 添加到页面的页脚时会发生这种情况，而嵌入式脚本试图在 中间 [=27] 执行=] 的页面。

如果是这种情况，你需要用wp_enqueue_script()在header中加载jQuery。所以这里最后一个参数需要是false：

wp_enqueue_script( 'my-jquery', get_template_directory_uri() . '/js/jquery.js', array(), time(), false );

现在代码以正确的顺序执行，jQuery 将被定义。

另一种解决方案是将嵌入式脚本移动到 Javascript 文件，该文件也将与 wp_enqueue_script() 一起添加到页面的页脚。这由你决定。

jQuery 未在 Wordpress 中定义，但我的脚本已正确排队

jQuery is not defined in Wordpress, but my script is enqueued properly

javascript

php

wordpress

jquery

slidetoggle