Javascript: функция загрузки тела ожидает завершения сценариев - PullRequest
Новая
       7

Javascript: функция загрузки тела ожидает завершения сценариев

3 голосов
/ 04 июня 2009

У меня есть некоторые функции, которые я вызываю, и они занимают некоторое время (миллисекунды), но я не хочу, чтобы страница отображалась до тех пор, пока эти функции не будут завершены. Прямо сейчас я могу сказать, что страница загружается, а затем сценарии в конечном итоге завершаются.

Прямо сейчас я вызываю функции в теле загрузки.

Кроме того, еще одна проблема, с которой я могу столкнуться, заключается в том, что мне нужен доступ к элементам div в html-содержимом. Могу ли я сделать это с помощью функции загрузки моего тела (getElementById ('somDiv'))?

Вот рабочий процесс.

  1. Выполните вызов getElementById ('someDiv'), чтобы получить элемент со страницы.

  2. Вызвать функцию someFunc, эта функция находится в теле onload = someFunc ()

  3. Подождите, пока не завершится someFunc

  4. Отображение страницы для пользователя после завершения моей функции.

Ответы [ 3 ]

5 голосов
/ 04 июня 2009

Что вы можете сделать, так это сохранить содержимое вашей страницы в div, который изначально имеет стиль display:none. Затем, когда ваш код JavaScript завершится, обновите стиль на div до display:block, например ::

<html>
    <head>
        ...
        <style type="text/css">
            html, body, #body {
                height: 100%;
                width: 100%;
                padding: 0;
                margin: 0;
            }
            #body {
                display: none;
            }
        </style>
        <script type="text/javascript">
            function myFunc() {
                ...
                getElementById('body').style.display = 'block';
            }
        </script>
    </head>
    <body onload="myFunc();">
        <div id="body>
            ...
        </div>
    </body>
</html>

Тогда Боб твой дядя: страница выглядит так, как будто она отложила загрузку до тех пор, пока твой сценарий не будет завершен.

1 голос
/ 04 июня 2009

Функции, вызываемые в событии onLoad тега <body>, запускаются только при загрузке DOM (однако он не ожидает загрузки внешних зависимостей, таких как файлы JavaScript и CSS), поэтому вы можете быть уверены, что когда вызывается ваша функция someFunc(), (если она присоединена к событию onLoad тега <body>), элементы на странице были загружены. Если вы хотите получить доступ к DIV, загруженному на странице, вы можете быть уверены, что он будет загружен при вызове вашей функции someFunc().

Чтобы решить вашу проблему, вы можете обернуть содержимое вашей страницы в DIV, для которого display изначально установлено на none. Затем, когда страница загрузится, вызывается ваша функция someFunc(). Когда он завершит выполнение, вы можете установить display вашей оболочки DIV на block, чтобы он был видим для пользователя.

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

0 голосов
/ 04 июня 2009

Функция тела onLoad запускается, когда DOM завершил загрузку, что означает, что все элементы HTML были полностью загружены. Таким образом, ваша функция onload сама должна предполагать, что все загружено и готово к работе, поскольку само ее выполнение выполняется в соответствии с этими рекомендациями.

...