我正在努力在单击时关闭导航切换,但是当我在移动设备上进行测试时,它会打开链接,而不仅仅是显示嵌套列表。我尝试了很多不同的东西,并广泛搜索了这个网站,但我无法弄清楚。
http://www.duddywebdesign.com/doti <-这是测试站点,这是标记
<nav>
<a href="#" id="menu-button" id="showmenu">☰ Menu</a>
<ul class="menu">
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Services</a>
<ul>
<li><a href="#">Microdermabrasion</a></li>
<li><a href="#">LED</a></li>
<li><a href="#">Massage</a></li>
<li><a href="#">Acupuncture</a></li>
<li><a href="#">Energy Work</a></li>
<li><a href="#">Packages</a></li>
</ul>
</li>
<li><a href="#">Blog</a></li>
</ul>
</nav>
这是jquery:
$('#menu-button').click(function() {
$('.menu').slideToggle('fast');
return false;
});
$( "li" ).has( "ul" ).addClass( "cursor" );
$('nav ul li a').click(function(e) {
if ($(this).hasClass("cursor")) {
e.preventDefault();
}
$(this).next("ul").slideToggle("fast");
});
这是我一直在尝试调整的最新代码,在此之前,导航中的任何链接都无法正常工作。请帮忙,谢谢。
尝试:
$('#menu-button').click(function(e) {
$('.menu').slideToggle('fast');
return false;
});
$( "li" ).has( "ul" ).addClass( "cursor" );
$('nav ul li a').click(function(e) {
if ($(this).hasClass("cursor")) {
$(this).next("ul").slideToggle("fast");
}
e.preventDefault();
});