Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Убить setInterval (https://javascript.ru/forum/misc/77028-ubit-setinterval.html)

yaparoff 15.03.2019 13:36

Убить setInterval
 
Пытаюсь убить setInterval с помощью clearInterval. Но получается как то не очень.
Дело в том что я пытаюсь двигать один блок с помощью setInterval и все вроде бы ок, но когда блок заканчивает двигаться setInterval все равно работает . Пробую убить его с помощью clearInterval, но тогда блок движется с каким то запозданием

Пробовал решить это также с помощью requestAnimationFrame, но тогда блок тоже движется с запозданием.

Вот код https://codepen.io/anon/pen/rRJjpE?editors=1010

Работает только в этом режиме

EvgeniySaschenko 15.03.2019 14:05

Скорее всего тебе нужно поместить clearInterval в setInterval и прописать условие при котором setInterval должен удалится:
timerMobileMove = setInterval(() => {
      console.log('move it')
      const leftCoord = table.getBoundingClientRect().left;
      tableHeader.style.left = `${ leftCoord }px`;
     if(условие){    
       clearInterval(timerMobileMove);
     }
    }, 1);

yaparoff 15.03.2019 14:35

Цитата:

Сообщение от EvgeniySaschenko (Сообщение 504822)
Скорее всего тебе нужно поместить clearInterval в setInterval и прописать условие при котором setInterval должен удалится:

осталось только понять какое условие.
например можно написать условие что таблица прекратила двигаться. Но как дать понять это JS, ведь она и так остановилась, а функция выполняется...?

EvgeniySaschenko 15.03.2019 14:45

Цитата:

Сообщение от yaparoff (Сообщение 504825)
осталось только понять какое условие.
например можно написать условие что таблица прекратила двигаться. Но как?

Тогда правильным вопросом будет: "при каком условии таблица должна перестать двигаться?" т.е. она достигла определённой координаты, ширины и т.п.

yaparoff 15.03.2019 15:02

Цитата:

Сообщение от EvgeniySaschenko (Сообщение 504827)
т.е. она достигла определённой координаты, ширины и т.п.

Мне кажется координата может быть любой, поэтому не знаю к чему привязыватся

EvgeniySaschenko 15.03.2019 16:50

Условием может быть что пользователь упёрся в правую сторону при прокрутке, тогда код будет такой:

timerMobileMove = setInterval(() => {
      console.log('move it')
      const leftCoord = table.getBoundingClientRect().left;
      tableHeader.style.left = `${ leftCoord }px`;
      let posScrollX= window.pageXOffset;
      let clientWidth= document.querySelector('body').clientWidth;
      let widthScroll= document.querySelector('body').scrollWidth;

     if(posScrollX + clientWidth - widthScroll == 0){    
       clearInterval(timerMobileMove);
     }
}, 1);


А что ты хочешь реализовать?

yaparoff 18.03.2019 09:31

Цитата:

Сообщение от EvgeniySaschenko (Сообщение 504837)
Условием может быть что пользователь упёрся в правую сторону при прокрутке

Это не то условие которое нужно
Цитата:

Сообщение от EvgeniySaschenko (Сообщение 504837)
А что ты хочешь реализовать?

Когда пользователь на мобилках завершает движение пальцем, то нужно убить setInterval.
Есть событие touchend - но оно срабатывает когда палец убрали. А пользователь же может не убирать палец. Ну ладно, пофиг, допустим сделаем clearInterval при событии touchend
Таймер чиститься но функция все равно продолжает вызываться снова
http://skrinshoter.ru/s/180319/VNHS5lPp
Как остановить ее окончательно?
https://codepen.io/anon/pen/rRJjpE?editors=0010


Часовой пояс GMT +3, время: 15:41.