Question

我不确定我的标题是否正确，但我要做的是停止fadeToggle（）;

当我点击一次fadeIn然后第二次点击fadeOut我的叠加但是当我点击像疯狂疯狂快速按钮它fadeIn和fadeOut真的很慢和马车......

我想要做的是防止这看起来错误，因为我正在学习基础知识，我不知道怎么做，但是......如果有人能告诉我的话，那么请你好吗？

以下是样本：

$('#overlay-trigger, div#overlay').on('click', function() {
    $('div#overlay').fadeToggle();
});

JS Fiddle Sample

因此，我有一个名为＃overlay-trigger的按钮。点击该按钮后，覆盖fadeIn（）;

之后点击叠加隐藏其自我......

所以，如果你只是一直快速点击，你会看到它有什么问题......它卡住，缓慢，滞后我不知道正确的短语......

请帮助我，并提前致谢。

Answer 1

使用停止：

$('div#overlay').stop().fadeToggle();

更多信息：http://api.jquery.com/stop/

Answer 2

你需要使用jQuery的.stop()方法和动画，传递所需的参数ex。 .stop(true)，.stop(true,true)等

$('#overlay-trigger, div#overlay').on('click', function() {
    $('div#overlay').stop().fadeToggle();
});

http://jsfiddle.net/nPShy/

Answer 3

您可以使用 :animated 选择器..

$('#overlay-trigger, div#overlay').on('click', function() {
    var $overlay = $('div#overlay');
    if( !$overlay.is(':animated')){
        $overlay.fadeToggle();
    }
});

<强> Check Fiddle

Answer 4

使用.one() 可能解决您的问题。来自jQuery API文档：

将处理程序附加到元素的事件。每个元素最多执行一次处理程序。

one()函数通过在第一次调用后取消绑定click事件来工作。要从代码中修改尽可能少的代码，只需使用它，如下所示：

$('#overlay-trigger, div#overlay').one('click', function() {
    $('div#overlay').fadeToggle();
});

我希望它有所帮助。干杯

如何停止功能或动画滞后/越野车的事情？

4 个答案: