0

一度に複数のアニメーションを実行するスクリプトに取り組んでおり、新しいアニメーションの開始時に基づいて、現在アニメーション化されている残りの要素を .stop() して別の場所に移動する必要があります (これは機能しています)。そこで、新しいアニメーションが追加されたときに .animate() されるアニメーションの配列を作成しました。各アニメーションが完了すると、それを配列から削除する必要があります。使用してみたコードは次のとおりです。

for (var i = 0; i < animations[key].length; i++) {
animations[key][i].object.animate({
    top: animations[key][i].endCoords.top,
    left: animations[key][i].endCoords.left
}, {
    duration: 800,
    complete: function() {
        console.log(i);
        animations[key].splice(i, 1);
        console.log(animations);
    }
});
}

問題は、完了時です: 実行iされ、animations[key].length に設定されます。アニメーションが終了する前にforループが継続しているため、なぜそれを行っているのかを理解していると確信しています（一度に複数のアニメーションを実行できるため、これは良いことです）が、コードを書く方法はありますか？完了したら: 接続を行うための適切なインデックスが実行されますか?

前もって感謝します！

4

1 に答える 1

0

反復ごとに異なる変数を使用/割り当てると、次のようになります。

for (var i = animations[key].length-1; i >= 0; i--) {
    var id = i;
    animations[key][id].object.animate({
        top: animations[key][id].endCoords.top,
        left: animations[key][id].endCoords.left
    }, {
        duration: 800,
        complete: function() {
            console.log(id);
            animations[key].splice(id, 1);
            console.log(animations);
        }
    });
}

そうしないとanimations[key].splice(animations[key].length, 1)、毎回呼び出すことになります (アニメーションが完了する前にループが実行されるため)。

それでも、アプローチを再考することをお勧めします。アニメーションが開始時とまったく同じ順序で完了しない限り、問題が発生する可能性があります。

編集:ループの方向を逆にします (以下の注を参照) - これには、アニメーションが逆の順序で開始されるという副作用があります

于 2012-04-22T00:44:30.127 に答える