clearTimeout при выходе из мыши - PullRequest
Новая
       11

clearTimeout при выходе из мыши

1 голос
/ 28 февраля 2012

У меня есть таймер, подобный так: 

var timerID;

$this.hover(function(){
   $this.find('.stage_obj').each(function(index){
      var current_obj = $(this);
      timerID = setTimeout(function(){
         animate_on_top(current_obj, index);}, parseInt(OS.delay_y_on_set[index],10));
      });   
}, function(){
   clearTimeout(timerID);
});

Существуют функции для управления анимацией входа / выхода при наведении. Таймеры действуют как задержки (.delay не будет работать в моей ситуации). Все работает нормально, за исключением того, что таймер не отменяется при выходе из мыши, и все еще срабатывает. Вот фактическая вызываемая функция animation_on: 

function animate_on_top(current_obj, index){ 
   current_obj.animate(
      {'top':OS.ends_y_set[index]},
      {duration:500, queue:false,
      specialEasing:{'top':'linear'}
});

У кого-нибудь есть идеи, почему setTimeout не отменяет таймер? Спасибо!

Ответы [ 2 ]

1 голос
/ 28 февраля 2012

Причина, по которой тайм-аут не очищен, заключается в том, что вы устанавливаете несколько тайм-аутов через each, но сохраняете (и, следовательно, очищаете) один из них.Вам нужно хранить и очищать каждый из идентификаторов времени ожидания, которые вы создаете.

var timerID = [];

$this.hover(function(){
   $this.find('.stage_obj').each(function(index){
      var current_obj = $(this);
      var currentTimerID = setTimeout(function(){
         animate_on_top(current_obj, index);}, parseInt(OS.delay_y_on_set[index],10));
      timerID.push(currentTimerID);
      });   
 }, function(){
   for (var i = 0; i < timerID.length; i++) {
     clearTimeout(timerID[i]);
   }
});
0 голосов
/ 28 февраля 2012

Вы используете одну и ту же переменную timerID в цикле, поэтому для каждой итерации ссылка меняется на последнюю.

Когда вы очищаете, вы фактически очищаете только последнюю, а не ссылки, которые высоздал!

Вы должны изменить свой код, чтобы передать список объектов для анимации в ваш метод animate_on_top() вместо того, чтобы устанавливать таймер для каждого из них независимо.

Или вы можете нажать ссылкивозвращается различными вызовами setTimout () в массив и очищает все ссылки на массив при наведении мыши.Что-то вроде: 

var timerID = [];

$this.hover(function(){
   $this.find('.stage_obj').each(function(index){
      var current_obj = $(this);
      var timer = setTimeout(function(){
         animate_on_top(current_obj, index);}, parseInt(OS.delay_y_on_set[index],10));
      });   
      timerID.push(timer);
 }, function(){
   for (var i = 0; i < timerID.length; i++) {
     clearTimeout(timerID[i]);
   }
});
...