Question

我正在学习jQuery而且我正在把事情搞定。

我通过点击菜单在菜单中创建了幻灯片。现在有2个事件.click，一个用于滑入，一个用于滑出。当我点击菜单而不是打开菜单并直接关闭它。

我该如何防止这种情况？我希望这样。当你点击菜单上的任何地方时会滑出。

你能帮助我吗？

$(document).ready(function(){

//Button fade by mouse enter
$("#menubutton").mouseenter(function(){
        $("#menubutton").fadeTo('slow', 0.5);
});

//Slide in menu by clicking on menu
$("#menubutton").click(function(){
    $("#menu").slideToggle('slide');    
});

//Back to normal after mouse leave
$("#menubutton").mouseleave(function(){
    $("#menubutton").fadeTo('slow' , 1);
});

$(document).click(function(){
    $("#menu").slideUp("slow");
});


});

非常感谢提前！

Answer 1

问题是您的按钮单击会传播到文档元素，因此它也会触发它向上滑动处理程序。你应该阻止这种传播：

//Slide in menu by clicking on menu
$("#menubutton").click(function(event){
    $("#menu").slideToggle('slide');
    event.stopPropagation();
});

Demo

单击文档jQuery删除菜单

1 个答案: