事件结束前点击函数触发函数答案

【问题标题】：click function triggering function before event finishes事件结束前点击函数触发函数
【发布时间】：2012-03-02 08:22:55
【问题描述】：

如果单击菜单本身或正文中的任何位置，我已经构建了一个下拉菜单，该菜单使用 slideUp 事件：

$('html, .currentPage').click(function() { 
    $('.currentMenu').slideUp('fast', function() { myFunction(); });
});

我在 slideUp 事件回调中也有一个函数。

但是，我的问题是在 html 或 .currentPage click 上调用该函数，无论是否发生了 slideUp 事件。

我怎样才能使它成为函数（）；仅在 slideUp 事件运行时发生？

【问题讨论】：

标签： javascript jquery

【解决方案1】：

$('html, .currentPage').click(function() { 
    var $currentMenu = $('.currentMenu');

    if($currentMenu.is(':visible')) { 
        $currentMenu.slideUp('fast', function() { myFunction(); });
    }
});

$('html, .currentPage').click(function() { 
    var $currentMenu = $('.currentMenu');

    if($currentMenu.is(':visible')) { 
        $currentMenu.slideUp('fast', myFunction);
    }
});

您还可以选择使用$currentMenu.css('display') != 'none' 代替$currentMenu.is(':visible')。

这些选项是根据slideUp() 的实际行为建议的，在http://api.jquery.com/slideUp/ 的官方文档中进行了描述。

【讨论】：

【解决方案2】：

$('.currentMenu').slideToggle('fast', function() { myFunction(); });

【讨论】：

【解决方案3】：

如果hasClass('open')，您可以将open 和slideUp() 添加到您的菜单中：

if ( $menu.hasClass('open') ) {
    $menu.slideUp('fast', function(){ });
    ...
}

【讨论】：

或者只是$('.currentMenu').is(':visible')
是的，这也取决于菜单的样式。
与菜单的样式无关。 slideUp() 隐藏菜单，因此，如果您的隐藏逻辑是 slideUp()，:is('visible') 是可靠的，这已在问题中定义。