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

php javascript jquery wordpress slidetoggle

2022-08-30 19:30:50

我正在尝试加载一个单独的javascript文件移动菜单.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-->

函数.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' );

移动菜单.js文件：

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

答案 1

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

答案 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() {
    .....
});