我怎樣才能多次調用setInterval？

-1

所以，我想用按鈕多次調用setInterval，但是當我第二次按下按鈕時沒有任何反應。我搜索了其他類似的問題，但他們在jQuery中，並沒有爲我工作。我怎樣才能多次調用setInterval？

編輯：我想要做的是通過點擊按鈕重複動畫。

var element, add, intervalo; 
 
add = 0; 
 
function start(){ 
 
\t intervalo = setInterval(interval, 50); 
 
} 
 
function interval() { 
 
\t add = add + 25; 
 
\t element = document.getElementById('teste'); 
 
\t element.style.left = add; 
 
\t if (add > 300) { 
 
\t \t clearInterval(intervalo); 
 
\t \t intervalo = null; 
 
\t \t element.style.left = 0; 
 
\t \t } 
 
\t }

#teste { 
 
\t position: absolute; 
 
}

<html> 
 
\t <head> 
 
\t \t <script src="js/main.js"></script> 
 
\t \t <link rel="stylesheet" src="text/css" href="css/estilo.css"> 
 
\t </head> 
 
\t <body> 
 
\t \t <h1 id="teste">Ola</h1> 
 
\t \t <button onclick="start()">Start</button> 
 
\t </body> 
 
</html> 
 
\t \t \t \t 
 
\t \t \t \t 
 
\t \t \t \t 
 
\t \t \t \t

來源

2015-10-19 Timerºº

如果啓動多個定時器，你就會有他們都共享該相同的變量的問題。 – Pointy

@Pointy我可以做些什麼來解決這個問題，除了創建更多變量之外還有其他方法嗎？ –

也許你的意思是在clearInterval塊中設置'add = 0'。 – Malk

你是不是重置add變量，所以當時間間隔被觸發第二次將向右走的clearInterval部分。

var element, add, intervalo, btn, element; 
 

 
add = 0; 
 
btn = document.getElementById('btn'); 
 
element = document.getElementById('teste'); 
 

 
function start() { 
 
    btn.disabled = true; 
 
    intervalo = setInterval(interval, 50); 
 
} 
 

 
function interval() { 
 
    add = add + 25; 
 
    element.style.left = add + 'px'; 
 
    if (add > 300) { 
 
    clearInterval(intervalo); 
 
    intervalo = null; 
 
    element.style.left = 0; 
 
    btn.disabled = false; 
 
    add = 0; 
 
    } 
 
}

#teste { 
 
    position: absolute; 
 
    left: 0; 
 
    top: 0; 
 
}

<html> 
 

 
<head> 
 
    <script src="js/main.js"></script> 
 
    <link rel="stylesheet" src="text/css" href="css/estilo.css"> 
 
</head> 
 

 
<body> 
 
    <h1 id="teste">Ola</h1> 
 
    <button id="btn" onclick="start()">Start</button> 
 
</body> 
 

 
</html>

來源

2015-10-19 23:58:42 Malk

感謝您的幫助，它現在可以工作：） –

我怎樣才能多次調用setInterval？

回答

相關問題