Javascript Функция setInterval() работает только один раз

Question

Ребята! Я хочу спросить о функции Javascript setInterval(). Моя проблема в том, что setInterval() работает только один раз, а не повторяется.

Вот мой HTML код

<button id = 'btun' name = 'btun' onclick = 'changecolor();' class = 'btn btn-success btn-block'>Color Change</button> 

и Javascript код

function below(t){ 
    var button = document.getElementById('btun'); 
    var quadrant = (t*t + 2*t + 1)+"px"; 
    console.log('ye'); 
    button.style.marginTop = quadrant; 
    document.write(pix); 
} 
var doBelow = setInterval(below(t++),1); 
if(t > 50){ 
    clearInterval(doBelow); 
} 

Я не могу найти то, что это не так.

Answer 1

setInterval ожидает обратного вызова в качестве первого аргумента, но вы вызываете фактическую функцию.

Вызов должен быть как ниже

setInterval(function() { 
     below(t++); } 
    ,1); 

Так вот вы создаете анонимную функцию обратного вызова, которая будет вызывать функции ниже. И лучше поставить условие выхода t >= 50 внутри below Функция

Answer 2

setInterval не работает даже один раз. Причина, по которой функция вызывается один раз, заключается в том, что вы вызываете ее при попытке использовать setInterval, а возвращаемое значение функции (которое равно undefined) используется в вызове setInterval.

Используйте выражение функции для создания интервала, который вызывает below(t++). Вы бы поставили код, который проверяет состояние t > 50 внутри функции, иначе это будет работать только один раз.

function below(t){ 
    var button = document.getElementById('btun'); 
    var quadrant = (t*t + 2*t + 1)+"px"; 
    console.log('ye'); 
    button.style.marginTop = quadrant; 
    document.write(pix); 
    if(t >= 50){ 
    clearInterval(doBelow); 
    } 
} 

var doBelow = setInterval(function() { below(t++); },1); 

Примечание: Использование document.write в интервале - это не очень хорошая идея. Когда он будет запущен после завершения страницы, он откроет новую страницу для записи, заменяющую текущую страницу.