1

我在 Chrome 和 Mozilla 中遇到了这个问题，而 IE 工作正常。当我最小化浏览器或打开一个新选项卡并在该选项卡上工作一段时间时，计时器会暂停，但如果 Web 应用程序再次成为焦点，则会再次恢复。我通过时间的差异知道这一点，例如大约一分钟左右后，当我返回 Web 应用程序时，只有一秒钟左右的时间过去了。我不知道是什么导致了这个问题。

这是我使用的 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 timer 插件，我不太喜欢这段代码。对于一个简单的任务来说，这似乎是不必要的复杂。像这样的代码不会激发信心：

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 回答