停止传播

Question

我有一个面板，可以通过单击类.open的元素来打开和关闭以显示菜单。当我第一次点击它时，没关系，面板打开了。面板打开后，单击菜单项，面板关闭。

我面临的问题是，在点击菜单项后面板关闭后，我需要在面板再次打开之前点击两次.open。

我首先运行这个：

$(".open").toggle(function(){
   $(".header").animate({height:"100%"},200);
   },function(){
        $(".header").animate({height:50},200);
});

这会打开一个面板，带有一个菜单，然后当我点击菜单项时，我会这样做：

$(".navMore li a").on("click", function(e) {
   e.preventDefault();
    ...

这是传播问题吗？添加：

$(".navMore li a").on("click", function(e) {
   e.preventDefault();
   e.stopPropagation();

仍然给我留下同样的问题。

Answer 1

click事件在JQuery中冒出来。为了防止你需要阻止传播在下层元素上冒泡和阻止更高元素的处理程序被触发。

在$('.open')函数中，您需要输入以下内容：

$(".open").toggle( function( event ) {
    if( !$( event.target ).is("a") )
        {
            $(".header").animate({height:"100%"},200);
        }
},....);