javascript - 防止jQuery中的click事件多次触发

我创建了一个jQuery content switcher。通常，它可以正常工作，但是存在一个问题。如果您多次单击侧面的链接，有时会显示多个内容。

该问题很可能是在click事件内的某个地方。这是代码:

$('#tab-list li a').click(
    function() {
        var targetTab = $(this).attr('href');
        if ($(targetTab).is(':hidden')) {
            $('#tab-list li').removeClass('selected');
            var targetTabLink = $(this).parents('li').eq(0);
            $(targetTabLink).addClass('selected');
            $('.tab:visible').fadeOut('slow',
                function() {
                    $(targetTab).fadeIn('slow');
                }
            );
        }
        return false;
    }
);

我尝试为过渡添加锁定，以便在过渡发生时忽略更多的点击，但无济于事。我还尝试使用以下方法来防止已经进行动画处理的情况触发转换:

if ($(':animated')) {
    // Don't do anything
}
else {
   // Do transition
}

但似乎总是认为事物正在被动画化。有什么想法可以防止多次触发动画吗？

最佳答案

一种想法是在函数开始时删除click事件，然后在动画结束时重新添加click事件，因此在持续时间内的单击将不起作用。

如果您有能力在动画完成后执行代码，则应该可以使用。

关于javascript - 防止jQuery中的click事件多次触发，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/1012447/