0

私はsetTimeout再帰関数で呼び出されています:

var recursiveTimer = function(duration, data) {
    anotherFunction(data);

    setTimeout(function() {
        // Do stuff with data
        data = {};

        recursiveTimer(duration, data);
    }, duration);
};

ここでの問題は、 myanotherFunctionが常に呼び出されるとは限らないことです。実行するたびに呼び出されていることを経験しrecursiveTimerます。

それはどうしてですか?

編集

anotherFunction()が実際に行っていることは、jQuery を使用して dom 要素をアニメーション化することです。このような:

$('#slider .slider-loader').find('.bg').css('width', "0%");

currentLoader.find('.bg').animate({
    width: "100%"
}, 3000);

最初の行が問題の場所です。毎回起動されるのではなく、1 回おきにのみ起動ます。

4

2 に答える 2

2

あなたのコメントと編集に基づいて、あなたの問題は、あなた.bgが間違った行動を観察するものがまだアニメーション化されているということです。

JQuery は、アニメーション化されたプロパティの初期値を格納し、アニメーションが終了するまでそれらを使用します。そのため、現在アニメーション化されている css プロパティを設定しても効果はありません。

この問題を回避するには、css プロパティの設定を変更する前に要素のアニメーションを停止する必要があります。

$('#slider .slider-loader').find('.bg').stop(true).css('width', "0%");

キューjQuery.clearQueuejQuery.stopをクリアするために使用できる 2 つのメソッドがあります。

アニメーション時間とタイムアウト時間への注意。アニメーションの長さをアニメーションに設定した場合、その持続時間も(またはそれ以上)3000ms続く可能性があります。3010mssetTimeout

于 2013-07-02T11:05:29.883 に答える
1

タイムアウトはアニメと同じ

あなたはそれをすべきではありません。代わりに、メソッドcompleteのコールバック パラメータを使用します。animate()

var bg = $('#slider .slider-loader').find('.bg');
var recursiveTimer = function(duration, data) {
    bg.animate({
        width: "100%"
    }, 3000, function() {
        // Do stuff with data
        data = {};
        bg.css('width', "0%");
        recursiveTimer(duration, data);
    });
};
于 2013-07-02T11:05:25.737 に答える