Link setIntervals 与 .each() 元素

Question

这个问题与这个问题相关

我像这样在每个函数中使用 setIntervals，

var allIntervals = [];
$(".elements").each(function() {
    var myInterval = setInterval(function() {
        // code that changes $(this)
    });
   allIntervals.push(myInterval);
});

然后我像这样清除所有间隔

jQuery.each(allIntervals, function(index) {
    window.clearInterval(allIntervals[index]);
});

我现在意识到我想清除 DOM 中不再存在的元素区间。

那么我如何link setIntervals 到每个() 元素，然后检查该元素是否仍在DOM 中，如果不在，则清除与该元素关联的Interval？

Answer 1

使用一个对象来存储信息（以元素和intervalid为属性），如果DOM元素不可用，循环对象并清除间隔。

$(function() {

  var intervals = [];

  $(".elements").each(function() {
    var myInterval = setInterval(function() {
      // code that changes $(this)
    });
    var obj = new Object();
    obj.element = $(this);
    obj.intervalId = myInterval;

    intervals.push(obj);
  });

  $.each(intervals, function(index, val) {
     console.log(val.element);
     if (val.element.length > 0) {
         window.clearInterval(val.intervalId);
     }
  });
});

Answer 2

您可以将具有超时 ID 的元素存储在一个对象中，但是您必须再次检查它是否在 DOM 中，因为存储的元素不会神奇地从变量中消失，它只是不再 DOM.

var allIntervals = [];

$(".elements").each(function(i, el) {
    var myInterval = setInterval(function() {
        // stuff
    }, 1000);
   allIntervals.push({id : myInterval, elem : this});
});


$.each(allIntervals, function(index, item) {
    if ( $(document).find(item.elem).length === 0 ) window.clearInterval(item.id);
});

FIDDLE

Link setIntervals 与 .each() 元素

Link setIntervals with .each() element

html

javascript

jquery

setinterval