0

刚才我问了一个问题，为什么我的 setInterval() 函数只会运行一次，

JS setInterval() 只在动画不透明度时运行一次

我已经回答了，但后来我想检查并确保循环停止，所以我在循环中添加了一个 alert() 并发现 clearInterval 没有清除，即使我最初运行了连接到全局变量的 setInterval 函数。 .

不透明度更改工作正常，但是现在单击确定后警报框会无限显示...最终我不需要警报功能我只是想看看间隔是否真的清除了它没有...

var run;
var runOpt;

document.getElementById('menu-1-A').style.opacity=0;
document.getElementById('menu-1-B').style.opacity=0;

function openSubMenu1(item) {
    runOpt=item;
    run = setInterval(runSubMenu1,35);
}

function runSubMenu1()  {

    var i=document.getElementById('menu-1-'+runOpt);

    if (parseInt(i.style.opacity) == 1) {
      clearInterval(run);
      alert('done');

    } else {
      i.style.opacity = parseFloat(i.style.opacity) + .1;
    }
}
4

2 回答 2

0

可能发生的情况是您在第一个 setInterval 完成之前启动了多个实例，因此 clearTimeout 在调用时具有错误的引用。

以下使用闭包而不是全局变量，因此每个调用都有自己的超时参考：

<div id="d0">jere</div>

<script>

var makeOpaque = (function() {
  var timeout, el;

  return function(id) {

    if (!el) {
      el = document.getElementById(id);
      timeout = setInterval(makeOpaque, 50)

    } else if (el && el.style.opacity < 1) {
      el.style.opacity = +el.style.opacity + 0.1;

      // debug
      console.log(el.id + ' : ' + el.style.opacity);

    } else {
      timeout && clearInterval(timeout);
      alert('done');
    }
  }
}());

makeOpaque('d0');
于 2013-10-15T03:03:08.483 回答
0

谢谢 plalx - openSubMenu1() 是从 onmouseover 运行的，它反复调用 openSubMenu1()，我创建了一个变量来测试菜单是否打开，如果它是 openSubMenu1() 在调用 setInterval() 之前返回 false ..

现在它只运行一次。谢谢。

于 2013-10-15T02:49:23.980 回答