JS clearInterval() не будет очищаться

Несколько минут назад я задал вопрос о том, почему моя функция 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;
    }
}

person B Rad C    schedule 15.10.2013    source источник
comment
Вы звоните openSubMenu1 несколько раз?   -  person plalx    schedule 15.10.2013
comment
Можете ли вы создать скрипт js?   -  person Vicky Gonsalves    schedule 15.10.2013


Ответы (2)


Спасибо, plalx - openSubMenu1() запускался из onmouseover, который неоднократно вызывал openSubMenu1(), я создал переменную, чтобы проверить, открыто ли меню, если оно открыто, openSubMenu1() возвращает false перед вызовом setInterval()..

теперь он запускается только один раз. Спасибо.

person B Rad C    schedule 15.10.2013

Что может произойти, так это то, что вы запускаете несколько экземпляров до завершения первого 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');
person RobG    schedule 15.10.2013