为什么这是我的jQuery函数触发两次？

Question

因此，我正在尝试创建一个小型的个人使用jQuery插件。 我已经完成了该功能，但是由于某种原因setInterval（）函数会触发两次，而且我似乎无法弄清楚原因。 起初它似乎不会触发两次，但是通过测试（在间隔的每个触发器上添加警报），我知道它会触发两次，在此示例中，您可以看到它逐渐变得越来越快（大约2分钟（时间会非常快）），这是它触发两次的结果。

有人可以帮我解决这个问题吗？

Javascript代码：

(function( $ ) {

  $.fn.imageSwap = function(img) {
  var src = this.attr("src");
  var id = this;
  id.fadeToggle("fast", function(){
  id.attr("src", img);
  id.fadeToggle("fast");
  });
  return this;
  };

 })( jQuery );



(function( $ ) {

  $.fn.slideShow = function(array, time) {
  var i = -1;
  var num = array.length;
  var id=this;

  var interval = setInterval(function(){
  i++
  if(i>(num)-1){i=0}
  id.imageSwap(array[i]);
  },time);

  };

页面代码：

<script>

$("#slideshow").slideShow([
"http://www.rta.nsw.gov.au/licensing/images/dkt_faqs/number1.gif",
"http://www.rta.nsw.gov.au/licensing/images/dkt_faqs/number2.gif",
"http://www.rta.nsw.gov.au/licensing/images/dkt_faqs/number3.gif",
"http://www.rta.nsw.gov.au/licensing/images/dkt_faqs/number4.gif"
], 1000);

</script>

<img id="slideshow" src=""/>

Answer 1

我在这里缩小了问题的范围，发现只有在切换选项卡时才发生此问题。 因此，一些搜索显示了一些东西。

根据设计，Chrome似乎会堆积setInterval调用。 因此，当您返回到非活动标签时，它恰好连续运行它们。

您可以在SO的其他相关问题中看到一些解决方法：

• 使用setInterval时，如果我在Chrome中切换选项卡然后返回，则滑块会疯狂地追赶
• 当Chrome中的标签页处于非活动状态时，如何使setInterval也起作用？