在asp.net Ajax應用程序中使用JavaScript倒數計時器

Question

花了數小時試圖弄清楚我的應用程序中發生了什么之后，我發現我的代碼存在一個問題，該問題設置了JavaScript間隔。

這是設置間隔的代碼...

Sys.Application.add_load(function PageLoad(sender, args) {

        var timer = $("#lbTimer");
        var intVal = "";
        var verifiedTime = Date.parse(timer.html());

        if ($("#imgLock").hasClass("hidden") && !isNaN(verifiedTime) && verifiedTime != null) {

            $("#imgLock").addClass("hidden");
            $("#imgUnlock").removeClass("hidden");

            intVal = setInterval(function () {
                $("#lbTimer").html(function () {
                    var t = parseInt((new Date() - verifiedTime) / 1000, 10);
                    t %= 3600;
                    var m = Math.floor(t / 60);
                    var s = Math.floor(t % 60);

                    if (m == 0 && s == 0) {

                        $("#lbLocked").removeClass("hidden");
                        $("#imgLock").removeClass("hidden");
                        $("#imgUnlock").addClass("hidden");
                        $("#lbTimer").html("");
                        window.clearInterval(intVal);
                        verifiedTime = "";
                    } else {
                        if (s == 0) {
                            $(this).html((m + ":0" + s).replace("-", ""));
                        } else {
                            $(this).html((m + 1 + ":" + s).replace("-", ""));
                        }

                        if (s > -10) {
                            if (m == -1) {
                                $(this).html($(this).html().replace(":", ":0"));
                            } else {
                                $(this).html($(this).html().replace("-", "0"));
                            }
                        } else {
                            $(this).html($(this).html().replace("-", ""));
                        }
                    }
                });
            }, 1000);

            $("#lbTimer").removeClass("hidden");


});

現在，如果重新加載整頁，這絕對可以正常工作。 問題是我正在開發一個支持ajax的網站，並且在updatepanal中進行所有更新。

我遇到的問題是，當updatepanel面板更新新的javascript間隔時，正在創建另一個計數器，因此正在#lbTimer中添加另一個計數器，導致兩個或多個倒數計時器之間出現閃爍。

顯然，由於腳本在每個頁面加載上運行，因此無法清除我可以看到的頁面上已經運行的間隔，這會導致多個計時器。

我確實添加了以下內容，從而解決了一段時間的問題，但是我需要計時器在部分頁面加載時再次進行更新。

if (!args.get_isPartialLoad()) {
//Timer code here
}

是否有人對我如何在我的應用程序中使用javascript倒數計時器有任何建議或建議，以允許我清除間隔以在部分頁面加載時創建一個新的計時器？

希望我已經提供了足夠的細節，但是如果需要，我可以添加更多。

在此先感謝您的時間和幫助！

Answer 1

在部分負載下寫入Followig以清除先前設置的計時器

var intervalID; 
var resetTimer = function() {   
if (intervalID) { 
clearInterval(intervalID) };   
intervalID = setInterval(function() {    your code here....};