Главная страница статей --> Советы по фотошопу, графике и хитрости в построении php кода

*.JS, когда грузиться думаешь?

Источник: realcoding.net

[2 страница]

Метод устранения


Все делается предельно просто. Пусть нужно подключить файл tools.js. Добавим в его конец инструкцию is_load = 1. В динамически создаваемую страницу выше тега <script src="tools.js"> запишем скрипт, в котором также объявим переменную is_load = 0. Тогда is_load будет равна 0, пока не загрузится tools.js, когда она станет равной 1. Когда загрузка tools.js подтвердится указанным образом, можно будет вызвать код, использующий содержимое этого файла. Этот код указан под собирательным именем tool(). Осталось только отловить момент окончания загрузки. Для этого используем таймер.

Запишем то, что проговорено словами, в виде кода:

<script language=JavaScript>

is_load = 0;

time_ = 100;

function
if_load() {

if (
is_load==0 )

setTimeout(if_load();,time_);

else

tool();

}

setTimeout(if_load();,time_);

</script>

<script language=JavaScript src=tool.js></script>

Обращаю особое внимание на размещение вспомогательного скрипта перед внешним. Порядок следования оказывается существенным, если динамически созданная страница обновляется. Тогда она уже является статической, и скрипты грузятся в порядке появления в коде. Перестановка вспомогательного и внешнего скриптов привела бы к тому, что сначала загрузился бы внешний скрипт - при этом было бы is_load = 1 - после чего загрузилась бы инструкция is_load = 0, что привело бы к непрекращающимся вызовам функции if_load().

Пример реализации.

Внешний скрипт tools.js:

function tool() {

alert(tools.js:tool() - Я уже загрузилась);

}

is_load = 1;

Тестовая страница:

<html>

<
head>

<
meta http-equiv=Content-Type content=text/html;charset=windows-1251>

<
title>Пример 2.</title>

<
script language=JavaScript>

is_load = 0;

time_ = 100;

function
if_load() {

if (
is_load==0 )

setTimeout(if_load();,time_);

else {

tool();

document.all.ilnb.innerHTML += - выполнено;

}

}

setTimeout(if_load();,time_);

</script>

<script language=JavaScript src=tools.js charset=windows-1251></script>

<script language=JavaScript>

code = <html>\n\

<head>\n\

<meta http-equiv=\Content-Type\ content=\text/html;charset=windows-1251\>\n\

<title>Пример 2. Динамически созданный документ</title>\n\

<script language=JavaScript>\n\

is_load = 0;\n\

time_ = 100;\n\

\n\

function if_load() {\n\

if ( is_load==0 )\n\

setTimeout(if_load();,time_);\n\

else {\n\

tool();\n\

document.all.ilnb.innerHTML += - выполнено;\n\

}\n\

}\n\

\n\

setTimeout(if_load();,time_);\n\

<+/script>\n\

<script language=JavaScript src=tools.js charset=windows-1251><+/script>\n\

</head>\n\

<body>\n\

<span id=\ilnb\>Проверяем доступность</span><br>\n\

Нажмите кнопку \Обновить\, и загрузка определится правильно, т.к. порядок \n\

следования вспомогательного и внешнего скриптов - правильный\n\

</body>\n\

</html>;

function test() {

w = window.open();

w.document.write(code);

}

</script>

</head>

<body>

<span id=ilnb>Проверяем доступность</span><br>

<a href=# onclick=test(); return false;>Создать динамический документ</a>

</body>

</html>

Как видим, все улажено, и в динамически создаваемой странице функция tool() вызывается только тогда, когда она становится доступной.

Благодарю всех за внимание и желаю творческих успехов!

Контакты
Редакция:
[0.001]