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

Question

我正在尝试将一个单独的javascript文件mobile-menu.js加载到我的Wordpress主题中。 当我查看控制台时，它说：“未定义jQuery”。 但是，我知道我已正确排队了脚本文件。 有任何想法吗？

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' );

mobile-menu.js文件：

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

Answer 1

添加wp_enqueue_script('jquery'); 在排队脚本之前。

Answer 2

首先确保标题中包含jquery文件，并且您的文件需要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 3

你可以试试：

首先使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 4

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 5

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

当将jQuery添加到页面的页脚 ，而嵌入式脚本尝试在页面的中间执行时，就会发生这种情况。

如果是这种情况，则需要使用wp_enqueue_script()在标头中加载jQuery。 因此，这里的最后一个参数必须为false ：

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

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

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