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 - 只执行一次代码

然而，可能更好地了解为什么它被执行多次，如果可能的话，解决这个问题而不是补偿它。

阻止Jquery动画运行两次

2 个答案:

DEMO - 只执行一次代码