0

終了する秒数を含む非表示フィールドに基づいて、テーブルの各行のカウントダウン タイマーを作成しようとしています。これが私がこれまでに行ったことです：

function countdownProcedure() {
    var interval = 1000;
    var i = 0;
    var seconds;
    $(".rfqTbl tr").each(function() {
        if(i > 0) {
            seconds = $(this).find("#sqbTimestamp").text();
            var days = Math.floor(seconds / (60*60*24));
            seconds -= days * 60 * 60 * 24;
            var hours = Math.floor(seconds / (60*60));
            seconds -= hours * 60 * 60;
            var minutes = Math.floor(seconds / 60);
            seconds -= minutes * 60;
            if(days < 1) { days=""; }
            $(this).find("#countDown").html(days + "<pre> Days</pre> " + hours + "<pre>:</pre>" + minutes + "<pre>:</pre>" + seconds);
            if(days > 1) {
                $(this).find("#countDown").css({
                    'color':'#2A7F15',
                    'font-weight':'bold'
                });
            };
            if(days < 1) {
                $(this).find('#countDown').css('color','red');
                $(this).find('#countDown pre:nth-of-type(1)').css('display','none');
            }
            if(seconds < 10) {
                $(this).find("#countDown").append("&nbsp;");
            };
            if(minutes < 60){ interval = 1000; };
        }
        i++; 
    }); 
    setInterval(countdownProcedure,interval);
};

ただし、私の問題は、表示される時間が更新され、したがって「カウントダウン」されるように、この関数を実行しようとしていることです (実際には 1 秒ごとまたは 30 秒ごと)。私が抱えている問題は、最初のカウントダウンの後にブラウザーがハングするだけで、クロムが何もしていないFirefoxとサファリにあります(ハングを防ぐための安全なガードがあると思います)。

どんな助けでも大歓迎です！

4

3 に答える 3

3

多数のsetInterval()呼び出しを実行しているため、イベント キューが関数でいっぱいになります。

あなたが意味することはsetTimeout()、あなたの機能の終わりに似ていると思います。

function countdownProcedure(){
  // all your logic
  setTimeout(countdownProcedure,interval);
};

違いは、停止するように指示するまで、x 秒ごとsetInterval()にコードを実行することです。

setTimeout()一方、x 秒後にコードを 1 回実行するだけです。

于 2013-07-03T12:19:51.557 に答える