javascript - Javascript 中只存在同一函数的一个实例

Question

我在 ul 中的 li 项上有一个 onclick 事件监听器，它启动 setInterval 函数，问题是如果我单击第二个 li item 同一间隔函数的另一个实例启动，前一个实例继续运行。如何“删除”前一个，只让最后一个“存在”？

我为类似问题找到的解决方案对我来说不起作用。

这是代码:

document.addEventListener('click', function (event) {

  var texta = document.getElementById('myTextarea');

   var item = event.target.closest('#yourlists li');
   if (item) {
    var ite = event.target.closest('#yourlists li').innerHTML;

    setInterval(function autoSave(){
          var listText = texta.value.split('\n');
          localStorage.setItem(ite, JSON.stringify(listText));
    }, 5000);

   }
});

Answer 1

使用clearInterval 。来自文档，

The clearInterval() method of the WindowOrWorkerGlobalScope mixin cancels a timed, repeating action which was previously established by a call to setInterval().

var myInterval;

document.addEventListener('click', function (event) {
     // ... code
    clearInterval(myInterval);
    myInterval = setInterval(function autoSave(){
      // ... code
    }, 5000);
    // ... code
});