Как приостановить setInterval при наведении на кнопку?

Question

[Артем Гартунг]

Имеется функция:

async function elUp(selector) {
  try {
    var html = await (await fetch(location.href)).text();
    var newdoc = new DOMParser().parseFromString(html, 'text/html');
    document.querySelector(selector).outerHTML = newdoc.querySelector(selector).outerHTML;
    return true;
  } catch(err) {return false;}
}

и собственно имеется сам window.setInterval("elUp('#reload')", 1000); который обновляет к примеру блок <div id="reload"></div>

Вопрос, как при наведении курсора на кнопку приостановить выполнение setInterval, а потом, когда курсор убран, запускать?

P.S. Кнопка находится внутри блока #reload

Comments

[WbICHA]

Остановить предыдущий и запустить новый.

[WbICHA]

Как приостановить setTimeout

как приостановить setInterval

Ты уж определись что у тебя.

[Артем Гартунг]

WbICHA, если на работу сайта не повлияет это никак то можно и так сделать, либо приостановить, а после его же запустить

[Артем Гартунг]

WbICHA, сорри, setInterval, сейчас подправлю

Answer 1

[sasmoney]

// Создание переменной для хранения идентификатора интервала
let intervalId;

// Функция, которую вы хотите выполнить внутри setInterval
function updateElement(selector) {
  // Ваш код обновления элемента
  console.log('Обновление элемента:', selector);
}

// Функция для приостановки выполнения setInterval
function pauseInterval() {
  clearInterval(intervalId);
}

// Функция для возобновления выполнения setInterval
function resumeInterval(selector) {
  intervalId = setInterval(() => {
    updateElement(selector);
  }, 1000);
}
// Обработчик события наведения курсора на кнопку
document.querySelector('#reload').addEventListener('mouseenter', () => {
  pauseInterval();
});

// Обработчик события убирания курсора с кнопки
document.querySelector('#reload').addEventListener('mouseleave', () => {
  resumeInterval('#reload');
});

// Запуск интервала при загрузке страницы
resumeInterval('#reload');