我正在尝试将单独的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");
});
});
答案 0 :(得分:25)
在排队脚本之前添加wp_enqueue_script('jquery');
。
答案 1 :(得分:5)
首先确保标题中包含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);
OR
// Use jQuery in place of $
jQuery(document).ready(function() {
.....
});
答案 2 :(得分: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 );
答案 3 :(得分:0)
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');
}
答案 4 :(得分:0)
错误jQuery is not defined
也可能出现在模板部分中嵌入的jQuery代码中。
当将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()
添加到页面的页脚中。这取决于您。