clearInterval не работает в Firefox

Здесь немного магии, я думаю, это прекрасно работает в Chrome, но не в Firefox или Opera.

var initList = setInterval(function(){ 
   if( cache.isAnimating ) return false;
    cache.isAnimating = true;
    aux.navigate( 1, $el, $wrapper, settings, cache ); //slide
   }, 3500) ;
$(document).ready(function(){
   initList = setInterval(function(){   
    if( cache.isAnimating ) return false;
    cache.isAnimating = true;
    aux.navigate( 1, $el, $wrapper, settings, cache );  
   }, 3500) ;
   })

при наведении курсора Firefox не очищает Interval:

$("div.ca-wrapper").mouseover(function(){
   clearInterval(initList);
   }).mouseout(function(){
     initList = setInterval(function(){     
     if( cache.isAnimating ) return false;
      cache.isAnimating = true;
      aux.navigate( 1, $el, $wrapper, settings, cache );    
     }, 3500) ;
})  

какие-либо предложения?

3 ответа

Решение

Вы не должны повторно объявлять одну и ту же переменную (initList) дважды. Используйте уникальное имя для каждого интервала.

Может быть, это то, что вы ищете:

var initList2, initList1 = setInterval(function () {
    if (cache.isAnimating) return false;
    cache.isAnimating = true;
    aux.navigate(1, $el, $wrapper, settings, cache); //slide
}, 3500);
$(document).ready(function () {
    initList2 = setInterval(function () {
        if (cache.isAnimating) return false;
        cache.isAnimating = true;
        aux.navigate(1, $el, $wrapper, settings, cache);
    }, 3500);
})

$("div.ca-wrapper").mouseover(function () {
    clearInterval(initList1);
    clearInterval(initList2);
}).mouseout(function () {
    initList2 = setInterval(function () {
        if (cache.isAnimating) return false;
        cache.isAnimating = true;
        aux.navigate(1, $el, $wrapper, settings, cache);
    }, 3500);
})

Но используя ваш исходный код, так как setInterval возвращает целое число, вы также можете использовать это:

не используйте это

цитируя Бориса Збарского

Нет гарантии, что setInterval возвращает последовательные целые числа (а на самом деле в некоторых случаях это не так), поэтому подход "вычитать один" не так уж велик...

var initList = setInterval(function () {
    if (cache.isAnimating) return false;
    cache.isAnimating = true;
    aux.navigate(1, $el, $wrapper, settings, cache); //slide
}, 3500);
$(document).ready(function () {
    initList = setInterval(function () {
        if (cache.isAnimating) return false;
        cache.isAnimating = true;
        aux.navigate(1, $el, $wrapper, settings, cache);
    }, 3500);
})

$("div.ca-wrapper").mouseover(function () {
    clearInterval(initList);
    clearInterval(initList - 1); // HERE, we are clearing the previous interval 
}).mouseout(function () {
    initList = setInterval(function () {
        if (cache.isAnimating) return false;
        cache.isAnimating = true;
        aux.navigate(1, $el, $wrapper, settings, cache);
    }, 3500);
})

Я думаю setInterval звонить раньше ready не требуется

function doSomething(){
    if( cache.isAnimating ) return false;
    cache.isAnimating = true;
    aux.navigate( 1, $el, $wrapper, settings, cache );  
}

$(document).ready(function(){
    initList = setInterval(doSomething, 3500) ;
});

$("div.ca-wrapper").mouseenter(function(){
    clearInterval(initList);
}).mouseleave(function(){
    initList = setInterval(doSomething, 3500) ;
})  

Вы пытались удалить первый setInterval? Кроме того, я немного пересушил ваш код.

$(document).ready(function(){
  var initList = null;
  setInit();

  $("div.ca-wrapper").mouseover(function(){
    clearInterval(initList);
  }).mouseout(function(){
    setInit();
  });
})

function setInit() {
  initList = setInterval(function(){   
    if( cache.isAnimating ) return false;
    cache.isAnimating = true;
    aux.navigate( 1, $el, $wrapper, settings, cache );  
  }, 3500);
}
Другие вопросы по тегам