1

Chrome と Mozilla でこの問題に直面していますが、IE は問題なく動作します。ブラウザーを最小化するか、新しいタブを開いてそのタブでしばらく作業すると、タイマーが一時停止しますが、Web アプリケーションに再びフォーカスがあると、再び再開します。これは時間の違いでわかります。たとえば、約 1 分ほど経過した後、Web アプリケーションに戻ったときに 1 秒ほどしか経過していません。この問題の原因はわかりません。

これが私が使用したjQueryスニペットです。タイマーはここからダウンロードできますhttp://code.google.com/p/jquery-timer/

 var countdownTimer, countdownCurrent;
    $(document).ready(function () {
        countdownCurrent = $('#ctl00_MainContent_example2submit').val() * 100;
        countdownTimer = $.timer(function () {
            var min = parseInt(countdownCurrent / 6000);
            var sec = parseInt(countdownCurrent / 100) - (min * 60);
            var micro = pad(countdownCurrent - (sec * 100) - (min * 6000), 2);
            var output = "00"; if (min > 0) { output = pad(min, 2); }
            $('.countdowntime').html(output + ":" + pad(sec, 2) + ":" + micro);
            if (countdownCurrent == 0) {
                $('#ctl00_MainContent_btnNext').click();

            } else {
                countdownCurrent -= 7;
                if (countdownCurrent < 0) { countdownCurrent = 0; }
            }
        }, 70, true);


        $('#example2submit').bind('keyup', function (e) { if (e.keyCode == 13) { countdownReset(); } });

    });

    function CheckIfOptionSelected() {

        var vFlag = true;
        var radioButton1 = document.forms[0].elements['ctl00_MainContent_rdBtnListOptions_0'];
        var radioButton2 = document.forms[0].elements['ctl00_MainContent_rdBtnListOptions_1'];
        var radioButton3 = document.forms[0].elements['ctl00_MainContent_rdBtnListOptions_2'];
        var radioButton4 = document.forms[0].elements['ctl00_MainContent_rdBtnListOptions_3'];

        if (radioButton1.checked == false && radioButton2.checked == false && radioButton3.checked == false && radioButton4.checked == false && countdownCurrent > 0) {
            vFlag = false;
        }

        else {
            countdownReset();
            vFlag = true;
        }
        return vFlag;
    }

    function countdownReset() {
        var newCount = parseInt($('#ctl00_MainContent_example2submit').val()) * 100;
        if (newCount > 0) { countdownCurrent = newCount; }
        countdownTimer.stop().once();
                }

    // Padding function
    function pad(number, length) {
        var str = '' + number;
        while (str.length < length) { str = '0' + str; }
        return str;
    }
4

1 に答える 1

1

私はその jQuery タイマー プラグインを調べましたが、コードがあまり好きではありません。単純なタスクには不必要に複雑に思えます。このようなコードは自信を呼び起こしません:

if(typeof func == 'object') {
    var paramList = ['autostart', 'time'];
    for(var arg in paramList) {if(func[paramList[arg]] != undefined) {eval(paramList[arg] + " = func[paramList[arg]]");}};
    func = func.action;
}

非常に必要な改行とコメントを追加して再フォーマットしました。

if(typeof func == 'object') {
    var paramList = ['autostart', 'time'];
    // Never use for..in to iterate over an array
    for(var arg in paramList) {
        if(func[paramList[arg]] != undefined) {
            // What does this eval code do and why?
            eval(paramList[arg] + " = func[paramList[arg]]");
        }
    };
    func = func.action;
}

機能するタイマーが必要な場合は、より単純なアプローチを採用して、ブラウザのsetInterval()orsetTimeout()を直接使用してみませんか? 経過時間を知る必要がある場合は、 を使用+new Dateして現在の時間をミリ秒単位で取得し、必要に応じて減算します。

ページが読み込まれてからの秒数を表示するテスト ページを次に示します。これは純粋なネイティブの HTML および JavaScript コードであり、すべてのブラウザーで動作するはずです。特に、IE が最小化されている場合は期待どおりに動作します。シンプルで信頼性の高いソリューションの出発点としてこれを使用できます。

<!DOCTYPE html>

<html>
<head>
    <title>Time Test</title>
</head>
<body>

    <code>
        This page has been open for
        <span id="timeOpen">0</span>
        seconds
    </code>

    <script>
        var timeStart = +new Date;
        setInterval( function() {
            var timeNow = +new Date;
            var secondsOpen = ( timeNow - timeStart ) / 1000;
            document.getElementById('timeOpen').innerHTML =
                Math.floor( secondsOpen );
        }, 250 );
    </script>

</body>
</html>

そして、これがフィドルのコードです。

于 2013-04-02T08:26:50.530 に答える