Как сбросить setinterval () после clearinterval () в событии hover и hoverout?

Question

Как только setInterval() запускается, я парю свой элемент, который вызывает clearInterval() для вызова. Но поскольку I hoverOut элемент setInterval() запускается дважды или просто не запускается вообще!

// activated is function what i want to do somthing
var off = setInterval(activated,3000);

$(".tab-content").hover(
() => {
     clearInterval(off);
},
() => {    
     var off = setInterval(activated,3000);        
})

Выполняется дважды за три секунды, но clearInterval не выполняется во второй раз при зависании.

Answer 1

Странное поведение должно быть из-за ключевого слова var во втором обратном вызове.

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

Что происходит так: вы впервые зависаете, значение off очищается, а затем оставляется элемент с помощью мыши, создаетсяновый интервал привязан к локальному off , а не к указанному выше. Ссылка на недавно созданный интервал теряется, поскольку среда выполнения Javascript покидает обратный вызов (еще раз, потому что off является локальным), другими словами, интервал не может быть очищен, поскольку вы потеряли ссылку. Теперь каждый раз, когда вы вводите и покидаете элемент, создается новый интервал, который заставляет «активированную» функцию запускаться почти случайным образом.

Поэтому измените свой код, удалив ключевое слово var…

// activated is function what i want to do somthing
var off = setInterval(activated,3000);

$(".tab-content").hover(
  () => {
     clearInterval(off);
  },
  () => {    
     off = setInterval(activated,3000);     
  }
)

off теперь относится к off, объявленному выше при наведении, и больше не является локальным.