Jquery Firefox/Firebug рекурсия

Question

Я взял этот фрагмент, и он прекрасно работает, но firefox/firebug умирают, если консоль firebug говорит "слишком много рекурсии". Вот пост с похожим вопросом, который, я не думаю, был правильно решен Jquery Too Much Recursion Error

Есть ли способ обеспечить непрерывную анимацию цветов без создания этой проблемы рекурсии? Если нет, как я могу заставить это работать без рекурсии? Укажите количество времени до конца?

$(document).ready(function() {
    spectrum();

    function spectrum(){
        var  hue = 'rgb(' + (Math.floor(Math.random() * 256)) + ',' +  (Math.floor(Math.random() * 256)) + ',' + (Math.floor(Math.random() *  256)) + ')';
        $('#welcome').animate( { backgroundColor: hue }, 1000);
        spectrum(); 
    }       
});

Answer 1

Вы запускаете эту функцию, как только можете, а не когда анимация завершена. Это приводит к тому, что функция запускается, вероятно, сотни раз в секунду, и возникает проблема с рекурсией:

$(document).ready(function() {

    spectrum();

    function spectrum(){
        var  hue = 'rgb(' + (Math.floor(Math.random() * 256)) + ',' +  (Math.floor(Math.random() * 256)) + ',' + (Math.floor(Math.random() *  256)) + ')';
        $('#welcome').animate( { backgroundColor: hue }, 1000, spectrum);
    }
});

Answer 2

Это потому, что ваш рекурсивный вызов постоянно срабатывает, а не срабатывает после завершения анимации. Вместо этого поместите вызов в функцию обратного вызова функции animate, например:

spectrum();
function spectrum() {
    var hue = 'rgb(' + (Math.floor(Math.random() * 256)) + ',' + (Math.floor(Math.random() * 256)) + ',' + (Math.floor(Math.random() * 256)) + ')';
    $('#welcome').animate({
        backgroundColor: hue
    }, 1000, function() {
        spectrum();
    });
}​