rotate.onclick = function () {
setTimeout(clickC(rotate),5000);
};
1 Answers
Ваш код не срабатывает по той причине, что первым аргументом в setTimeout Вы передаете результат вызова функции clickC(rotate).
Правильной записью данного выражения будет
rotate.onclick = function () {
setTimeout(function () {
clickC(rotate);
}, 5000);
};
или
rotate.onclick = () => setTimeout(() => { clickC(rotate); }, 5000);
Немного теории
У методов setTimeout и setInterval есть две формы вызова, которые различаются типом и количеством аргументов:
Первый аргумент - строка, содержащая код. Второй - значение задержки в миллисекундах.
alert('Через 3 секунды будет показано сообщение'); setTimeout("alert('Привет!');", 3000);
Такая форма вызова выглядит проще, но она не рекомендуется, по тем же причинам что и использование eval: это медленнее, и это может быть небезопасно.
- Первый аргумент - callback-функция.
Второй - значение задержки в миллисекундах.
Третий и последующие - параметры, которые будут переданы аргументами в callback-функцию.
let rotate = document.getElementById('rotate');
rotate.style.transform = 'skewX(-5deg) rotate(0deg)';
rotate.addEventListener('click', () => {
// таймаут с вызовом ф-ции clickC, и передачей ей трех аргументов
setTimeout(clickC, 1000, rotate, -180, 180);
});
clickC(rotate, 0, 0);
console.log('Клик по центрованному элементу установит таймаут вызова clickC(rotate, -180, 180)');
function clickC(el, skInc, rtInc) {
el.style.transform = el.style.transform.replace(
/^skewX((.+)deg)\s+rotate((.+)deg)$/i,
(s, m1, m2) => skewX(${+m1 + skInc}deg) rotate(${+m2 + rtInc}deg)
);
el.textContent = el.style.transform;
}
body {
display: flex;
flex-direction: column;
justify-content: center;
height: calc(100vh - 3em);
}
#rotate {
flex: 0 0 auto;
text-align: center;
font: 24px sans-serif;
cursor: pointer; user-select: none;
transition: transform 0.8s linear;
}
<div id="rotate"></div>
- 10,940
setTimeout(function() { clickC(rotate); },5000);– MedvedevDev Apr 01 '18 at 05:21setTimeout(clickC, 5000, rotate);ie10+ – Artem Gorlachev Apr 01 '18 at 05:48