我在使用jQuery mmenu和Wordpress时遇到了一个非常奇怪的问题。
问题: 菜单,子菜单项和选项卡显示正确,但是我只能打开和关闭菜单1次-与子菜单相同。打开一次后,我将无法再次打开。 我还注意到,当上述问题发生时,某些东西从dom中删除了mmenu元素类。
我的jQuery版本是:1.12.4。
这是我的实现: 我使用的是自定义主题,我在npm上安装了mmenu,然后在Theme.php中注册了js和css文件。
控制台中没有js错误。
我还在纯html文件中测试了具有相同选项的相同菜单,并且在那里正常运行,因此我认为Wordpress可以解决这一问题。
我也尝试停用插件,但还是没有运气。
有人知道可能是什么问题吗?
在此先感谢
我的导航:
<nav id="menu">
<div id="panel-menu">
<ul>
<li><a href="#/">Home</a></li>
<li><span>About us</span>
<ul>
<li><a href="#/">History</a></li>
<li><span>The team</span>
<ul>
<li><a href="#/">Management</a></li>
<li><a href="#/">Sales</a></li>
<li><a href="#/">Development</a></li>
</ul>
</li>
<li><a href="#/">Our address</a></li>
</ul>
</li>
<li><a href="#/">Contact</a></li>
<li class="Divider">Other demos</li>
<li><a href="default.html">Default demo</a></li>
<li><a href="onepage.html">One page demo</a></li>
</ul>
</div>
<div id="panel-account">
<ul>
<li><a href="#/">My profile</a></li>
<li><a href="#/">Privacy settings</a></li>
<li><a href="#/">Activity</a></li>
<li><a href="#/">Sign out</a></li>
</ul>
</div>
</nav>
我的mmenu电话:
$( document ).ready( function() {
$('nav').mmenu({
setSelected : true,
counters : true,
searchfield : false,
iconbar : {
add : true,
size : 60,
top : [
'<div class="tooltip hidden">Tooltip</div>',
'<div class="menu-item active"><a href="#" data-description="Degreee"><i class="pull-left icon-progress-circle progress progress-minidegree" data-percentage="0.45"></i></a></div>',
'<div class="menu-item"><a href="#" data-description="Manager"><span><img src="img_1.png"></span></a></div>',
'<div class="menu-item"><a href="#" data-description="Training"><img src="img_2.png"></a></div>'
],
bottom : [
'<div class="menu-item"><a href="#" data-description="Settings"><img src="img_3.png"></span></a></div>',
'<div class="menu-item profile"><a href="#" data-description="Profile"><img class="avatar" src="https://secure.gravatar.com/avatar/a95d58177b6931917b6d58e68e86292f?s=64&d=mm&r=g"></span></a></div>',
]
},
sidebar : {
collapsed : {
use : '(min-width: 450px)',
size : 40,
hideNavbar : false
},
},
navbars : [
{
type : 'tabs',
content : [
'<a href="#panel-menu"><i class="fa fa-bars"></i> <span>Menu</span></a>',
'<a href="#panel-account"><i class="fa fa-graduation-cap"></i> <span>Learning</span></a>'
]
}, {
content : [ 'prev', 'breadcrumbs', 'close' ]
}
]
}, {
navbars : {
breadcrumbs : {
removeFirst : true
}
}
});
});