javascript - 为什么使用 setInterval 时似乎将两个值设置为单个变量？

Question

我有这段代码，用于监听套接字发出的信号，然后每 5 秒启动一个间隔循环。间隔使用 jquery 将页面上的文本更改为从套接字发出的值。

   socket.on("activeBid", function(data) {
        $('#noActiveBid').hide();
        $('#activeBid1').hide();
        $('#activeBid').show();
        $('#activeBidValue').text(data.activeBid);
        setInterval(delayTime, 5000);
        function delayTime () {
          $('#ago2').text(moment(data.bidTime).fromNow());
        }
  });

代码每 5 秒执行一次，一切正常，直到我发出另一个套接字事件，导致发送新的数据值 (data.bidTime)。旧的 bidTime 值保留在该时间间隔内，新的 bidTime 值也会添加进来，因此页面上的文本每 5 秒在这两个值之间更改一次。这是为什么？

当我通过 console.log 记录 data.bidTime 值，然后引发另一次发出，从而导致发送另一个值时，我每 5 秒就会收到两个不同的值记录到控制台。

Answer 1

setInterval 创建一个新的间隔，每 5 秒执行一次 delayTime。当再次调用activeBid时，旧的间隔仍然存在。您可能想在创建新间隔之前删除第一个间隔:

var interval;
socket.on("activeBid", function(data) {
    clearInterval(interval);

    $('#noActiveBid').hide();
    $('#activeBid1').hide();
    $('#activeBid').show();
    $('#activeBidValue').text(data.activeBid);

    function delayTime () {
      $('#ago2').text(moment(data.bidTime).fromNow());
    }

    interval = setInterval(delayTime, 5000);
});