Почему показывает, что прокрутки у страницы нету в while, хотя она есть?

Question

[podushka]

Здравствуйте!
Есть страница, после загрузки которой производится "калибровка". В таблицу вставляются блоки до того момента, пока у страницы не появится скролл. Вот код:

var max_tickets = 0;
            function calibration() {
                var calibration_cancel = false;
                while(calibration_cancel != true) {
                    var block = document.getElementById('block'); // целевой блок
                    var isVerticalScroll= block.scrollHeight > block.clientHeight; // вертикальный скролл

                    if(isVerticalScroll != true) {
                        $(function(){
                            var newElems = $('<tr>')
                            .append('<td>0</td>')
                            .append('<td>0</td>')
                            $('.tables table:first-child').append(newElems);
                        });
                        max_tickets = max_tickets + 1
                    } else {
                        calibration_cancel = true
                    }
                }
                console.log(max_tickets)
            }

но переменная "isVerticalScroll" всегда показывает false, хотя, если посмотреть значение переменной после выполнения функции (к примеру, если вызвать console.log при нажатии на кнопку), то значение уже будет true.
Почему такое происходит и как такое можно решить?

Answer 1

[Сергей delphinpro]

Потому что ваш цикл while блочит поток выполнения.
Можно воспользоваться функцией setInterval – каждый новый запуск будет выполнятся в новой итерации цикла событий (event loop), давая браузеру время на выполнение других необходимых задач. Например пересчитать и перерисовать объекты на странице.