我一直在努力做到这一点,以便用户单击时隐藏我的导航。我只是设法做到了这一点,显然我做错了什么。
这是我到目前为止的内容:
如果没有正文,请点击http://jsfiddle.net/yL45ds8j/
尝试单击身体(它会立即将其隐藏)http://jsfiddle.net/yL45ds8j/1/
代码:
function handler1() {
$('.headnav').addClass('open').animate({
top: "0"
},400);
$(this).addClass('open');
$(this).one("click", handler2);
}
function handler2() {
$('.headnav').removeClass('open').animate({
top: "-100%"
},400);
$('.menuBtn').removeClass('open');
$('.menuBtn').one("click", handler1);
}
$(".menuBtn").one("click", handler1);
$('body').click(function(event) {
if(!$(event.target).closest('.headnav.open').length) {
if($('.headnav').hasClass("open")) {
$('.headnav').removeClass('open').animate({
top: "-100%"
},400);
}
}
});
有人对我如何解决这个问题有任何建议吗?非常感谢
menuBtn的click事件冒泡到主体,并且body click事件的处理程序将其关闭。请在menuBtn处理程序中停止事件的传播。
e.stopPropagation();
小提琴:http : //jsfiddle.net/yL45ds8j/8/
这是更清洁的解决方案:jsfiddle.net/yL45ds8j/6
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句