Question

这是我的javascript：

<script type="text/javascript">
var timer;

$(document).ready(function () {
    timer = setInterval(updatetimerdisplay, 1000);

    $('.countdown').change(function () {
        timer = setInterval(updatetimerdisplay, 1000);
    });

    function updatetimerdisplay() {
        $(".auctiondiv .auctiondivleftcontainer .countdown").each(function () {
            var newValue = parseInt($(this).text(), 10) - 1;
            $(this).text(newValue);

            if (newValue >= 9) {
                $(this).css("color", "");
                $(this).css("color", "#4682b4");
            }

            if (newValue == 8) {
                $(this).css("color", "");
                $(this).css("color", "#f3982e");
            }

            if (newValue == 5) {
                $(this).css("color", "");
                $(this).css("color", "Red");
            }

            if (newValue <= 1) {
                //$(this).parent().fadeOut();
                clearInterval(timer);
            }
        });
    }
});

var updateauctionstimer = setInterval(function () {
    $("#refreshauctionlink").click();
}, 2000);

function updateauctions(response) {
    var data = $.parseJSON(response);

    $(data).each(function () {
        var divId = "#" + this.i;
        if ($(divId + " .auctiondivrightcontainer .latestbidder").text() != this.b) {
            $(divId + " .auctiondivrightcontainer .latestbidder").fadeOut().fadeIn();
            $(divId + " .auctiondivrightcontainer .auctionprice .actualauctionprice").fadeOut().fadeIn();
            $(divId + " .auctiondivleftcontainer .countdown").fadeOut().fadeIn();
        }

        $(divId + " .auctiondivrightcontainer .latestbidder").html(this.b);
        $(divId + " .auctiondivrightcontainer .auctionprice .actualauctionprice").html(this.p);

        if ($(divId + " .auctiondivleftcontainer .countdown").text() < this.t) {
            $(divId + " .auctiondivleftcontainer .countdown").html(this.t);
        }
    });
}
</script>

基本上，我想重新打开计时器，如果有任何.countdown元素有文本更改。

由于我用来更新该值的AJAX调用，文本将会改变。

目前，计时器未重新启用，倒计时在.Countdown的值更改后冻结。我认为当元素的文本发生变化时会触发change（）事件。这是对的吗？

我有任何明显的错误吗？

Answer 1

您尝试在元素存在之前绑定change事件。将该代码放在ready事件处理程序中：

$(document).ready(function () {
  timer = setInterval(updatetimerdisplay, 1000);

  $('.countdown').change(function () {
    timer = setInterval(updatetimerdisplay, 1000);
  });

});

您还可能希望在计时器关闭时将timer变量设置为可识别的值（例如null），以便您可以在启动计时器之前检查该值以防止启动多个计时器。

Answer 2

您的代码包含循环和条件：

function updatetimerdisplay() {
    $(".auctiondiv .auctiondivleftcontainer .countdown").each(function () {
    ...
        if (newValue <= 1) {
            //$(this).parent().fadeOut();
            clearInterval(timer);
        }
        ...
    }
}

这些元素中的一个很可能具有满足条件newValue <= 1的值。在这种情况下，计时器将停止。即使更改输入字段的内容，计时器也会在运行后立即停止。

如果您必须支持多个计时器，请使用计时器钱包（var timers = {};timers.time1=...或var timers = [];timers[0] = ...）。如果您只需要支持一些超时，您甚至可以使用变量（var timer1=... ,timer2=..., timer3=...;）。

在调用clearInterval后如何重新启用setInterval？

2 个答案: