jquery - 停止运行两次 Jquery 动画

Question

我试图让这个动画在第一次运行后停止，但如果我添加 .stop(true) 将不起作用..任何想法？

这是我的 jQuery。

function doDisplayError(){  
    $("#errors").animate (
            { 'top': '200px' }, {
                duration: '300',
                easing: 'easeOutQuad'
            }).delay(3000).animate (
            { 'top': '-200px' }, {
                duration: '200',
                easing: 'easeInBack'
            });
}

Answer 1

error_run_once=0;
function doDisplayError(){  
    if (error_run_once=0){
        $("#errors").animate (
            { 'top': '200px' }, {
               duration: '300',
               easing: 'easeOutQuad'
            }).delay(3000).animate (
           { 'top': '-200px' }, {
               duration: '200',
               easing: 'easeInBack'
            });
        error_run_once = 1;
    } else{
       // what else you want to do if you don't show animation?
    }
}

看看它是否有效.. == 编辑 ==

而且，就像另一位评论的那样，更好的方法可能是根本不调用它。修改它的调用方式可能是更好的方法。

Answer 2

您可以使用一个变量来确定是否发生了类似这样的执行：

var animationExecuted = false;

function doDisplayError() {
    if(animationExecuted){
        return false;
    };
    console.log("executed");
    animationExecuted = true;

    $("#errors").animate({
        'top': '200px'
    }, {
        duration: '300',
        easing: 'easeOutQuad'
    }).delay(3000).animate({
        'top': '-200px'
    }, {
        duration: '200',
        easing: 'easeInBack'
    });
}​

DEMO - 只执行一次代码

但是，最好了解它为什么会多次执行，并尽可能解决该问题而不是对其进行补偿。