我正在尝试使用此javascript代码打开/关闭megamenu部分以使用Wordpress:
它适用于html模板。我还创建了一个可行的Walker。
var swMegaMenu = (function() {
var $listItems = $( '#sw-hrmenu > ul > li' ), // Uncaught TypeError: Undefined is not a function
$menuItems = $listItems.children( 'a' ),
$body = $( 'body' ),
current = -1;
function init() {
$menuItems.on( 'click', open );
$listItems.on( 'click', function( event ) { event.stopPropagation(); } );
}
function open( event ) {
if( current !== -1 ) {
$listItems.eq( current ).removeClass( 'sw-hropen' );
}
var $item = $( event.currentTarget ).parent( 'li' ),
idx = $item.index();
if( current === idx ) {
$item.removeClass( 'sw-hropen' );
current = -1;
}
else {
$item.addClass( 'sw-hropen' );
current = idx;
$body.off( 'click' ).on( 'click', close );
}
return false;
}
function close( event ) {
$listItems.eq( current ).removeClass( 'sw-hropen' );
current = -1;
}
return { init : init };
})();
和(页脚中的代码段):
<script>
(function($) { // Uncaught TypeError: Cannot read property 'init' of undefined
swMegaMenu.init();
})(jQuery);
</script>
知道如何解决这个问题吗?
答案 0 :(得分:0)
我认为你需要这样做:
var swMegaMenu = (function () {
var $listItems = $('#sw-hrmenu > ul > li'), // Uncaught TypeError: Undefined is not a function
$menuItems = $listItems.children('a'),
$body = $('body'),
current = -1;
function open(event) {
if (current !== -1) {
$listItems.eq(current).removeClass('sw-hropen');
}
var $item = $(event.currentTarget).parent('li'),
idx = $item.index();
if (current === idx) {
$item.removeClass('sw-hropen');
current = -1;
}
else {
$item.addClass('sw-hropen');
current = idx;
$body.off('click').on('click', close);
}
return false;
}
function close(event) {
$listItems.eq(current).removeClass('sw-hropen');
current = -1;
}
return { init: init };
})();
swMegaMenu.initialize = function()
{
$menuItems.on('click', open);
$listItems.on('click', function (event) { event.stopPropagation(); });
}
在页脚中:
<script>
(function($) { // Uncaught TypeError: Cannot read property 'init' of undefined
swMegaMenu.initialize();
})(jQuery);
</script>
我无法验证代码,因为没有提供标记,但它应该是这样的。
答案 1 :(得分:0)
您正在使用WordPress,默认情况下包含noConflict() mode中的jQuery。在noConflict()
模式下,jQuery的全局$
快捷方式不可用。
因此,您需要将(function()
更改为(function($)
,将结束()
更改为(jQuery)
。
在the WordPress Codex中了解有关noConflict()
包装的更多信息。