Нужно чтобы при нажатии на кнопку "Return Interval" процедура продолжала действие. Что в коде неправильно?
let colors = ["green", "red", "blue", "black"];
let div = document.getElementsByTagName('div');
let buttons = document.querySelectorAll('button');
let x = -1;
let y = 2000;
let changeColors = setInterval(function() {
x += 1;
div[0].style.backgroundColor = colors[x];
if (x === colors.length) {
x = -1;
}
}, 2000)
buttons[0].addEventListener('click', function() {
clearInterval(changeColors);
changeColors = null;
})
buttons[1].addEventListener('click', function() {
if (changeColors === null) {
let changeColors = setInterval(function() {
x += 1;
div[0].style.gackgroundColor = colors[x];
if (x === colors.length) {
x = -1;
}
buttons[0].addEventListener('click', function() {
clearInterval(changeColors)
});
}, 2000)
};
})
div {
width: 150px;
height: 150px;
border-radius: 50%;
background-color: red;
}
<div></div>
<button>Clear Interval</button>
<button>Return Interval</button>
const colors = ["green", "red", "blue", "black"];
const div = document.getElementsByTagName('div');
const buttons = document.querySelectorAll('button');
let x = 0;
const changeColor = () => {
div[0].style.backgroundColor = colors[x++];
if(x === colors.length){
x = 0;
}
}
let changeColors = setInterval(changeColor, 1000);
buttons[0].addEventListener('click', function(){
clearInterval(changeColors);
changeColors = null;
})
buttons[1].addEventListener('click', function(){
if(changeColors === null){
changeColors = setInterval(changeColor, 1000);
};
})
div{
width: 150px;
height: 150px;
border-radius: 50%;
background-color: red;
}
<div></div>
<button>Clear Interval</button>
<button>Return Interval</button>
Апостиль в Лос-Анджелесе без лишних нервов и бумажной волокиты
Основные этапы разработки сайта для стоматологической клиники
Продвижение своими сайтами как стратегия роста и независимости