如何仅在前一个单击完成时执行下一个单击

How to execute the next click only when previous click finish?

本文关键字:单击 一个 完成时 执行 下一个 何仅      更新时间:2023-09-26

我的HTML:

<div>
    <p>Testing Paragraph</p>
    <span>Testing Span</span>
    <div class="content">This is the main content of this div</div>
</div>
我jQuery:

$('p').click(function () {
    $(this).parent().find('.content').slideToggle('slow');
});

小提琴:http://jsfiddle.net/Vs5DX/

从演示中可以看到,当您单击段落时,内容将向上和向下滑动。问题是,如果我快速点击段落多次,那么它就会在没有点击的情况下不断上下移动。

我试过:

$(this).parent().find('.content').stop(true).slideToggle('slow'); 

但是当动画停止时更糟。什么好主意吗?

您可以使用:not来排除当前:animated元素:

$('p').click(function () {
    $(this).parent().find('.content:not(:animated)').slideToggle('slow');
}); 

更新小提琴

以变量开头:

varClicked = false;

在slideDown设置为true,只有当它为true时才允许slideUp,在slideUp设置为false