Фрейм - это такое же окно, как и само окно браузера. Точнее, это объект того же класса. К нему применимы те же методы, что и к обычному объекту "окно".
Пример 8.1 (кликните, чтобы открыть). Рассмотрим страницу из двух одинаковых фреймов:
Пример 8.3. Часы в двух фреймах (работают там, где фокус) (html, txt)
В файл clock.htm поместим следующую страницу, которая тем самым будет отображаться в обоих фреймах:
<HTML><HEAD><SCRIPT>var flag=false;function clock(){ if(flag) { var d = new Date(); document.f.e.value = d.getHours() + ':' + d.getMinutes() + ':' + d.getSeconds(); }setTimeout('clock();',100);}</SCRIPT></HEAD> <BODY onLoad='clock()'onFocus='this.flag=true'onBlur='this.flag=false'> <FORM NAME=f><INPUT NAME=e></FORM></BODY></HTML>
Пример 8.4. Часы запускаются, если данное окно в фокусе (html, txt)
Если кликнуть на любом из двух фреймов, то пойдут часы именно в этом фрейме, а в другом фрейме, если они уже были запущены ранее, остановятся.
Обработчики событий onFocus и onBlur определены для любого поля формы (текстовое однострочное поле, текстовая область, кнопка, радиокнопки, ниспадающие списки). В качестве одного из возможных применений этих обработчиков рассмотрим защиту поля от ввода (изменения) содержимого:
Когда пользователь попытается установить курсор в таком поле ввода, тем самым передав ему фокус, наш обработчик события уведет из него фокус и тем самым изменение поля становится невозможно.
Примечание. Этот пример приведен лишь в качестве демонстрации обработчиков событий. В настоящее время для защиты поля от изменения достаточно указать у него атрибут READONLY, т.е. предыдущий пример равносилен следующему:
Обмен данными в Web-технологии подробно рассматривается в курсе"Введение в CGI". Здесь же мы рассмотрим возможности передачи скрытых от пользователя данных с использованием JavaScript. Начнем с простого примера.
Пример 8.5. Отправка данных из скрытых полей формы (html, txt)
После нажатия кнопки в адресной строке вы увидите, что помимо user=имя имеется также h=имя_вашего_браузера. В заполненной Вами форме поля h не было видно. Таким образом, форма передала на сервер дополнительную информацию помимо Вашего желания. Это уже неприятно, хотя сама информация в данном случае (имя браузера) не представляет из себя ничего криминального. Если бы в качестве метода передачи данных был использован не GET (как в нашем примере, по умолчанию), а POST, то этой скрытой передачи данных пользователь даже не заметил бы.
Пример 8.3. Пример состоит из двух фреймов (расположенных в файлах left.htmи right.htm ), в которые помещена одинаковая форма. В правый фрейм, помимо этого, помещен также следующий скрипт:
function copyFields(){ here = document.forms[0].elements; there = window.top.frames[0].document.forms[0].elements; here[0].value = there[0].value; here[1].value = there[1].value; here[2].value = there[2].value; here[3].value = there[3].value; setTimeout('copyFields()',100);}window.onload=copyFields;
Функция copyFields() запускается раз в 0,1 сек. Когда пользователь вводит данные в левом фрейме, эти же данные попадают в соответствующие поля правого фрейма. Таким образом, данные из одного окна могут быть считаны программой из другого окна (или фрейма). Вопрос только в том, хотите ли вы, чтобы это происходило. Как решаются эти вопросы, рассказано ниже в разделе "Модель безопасности".
Еще один пример - отправка данных по событию без наличия видимой формы на web-странице:
При нажатии на гипертекстовую ссылку произойдет не только выдача сообщения, которое в этой ссылке указано, но и отправка данных формы. В итоге вы получите два окна предупреждения. Но второе окно вы не заказывали!
Конечно, бесконтрольной передачи данных на сервер можно избежать, введя режим подтверждения отправки (в настройках браузера). Но, во-первых, многие пользователи его отключают, а во-вторых, можно использовать не формы, а, например, графику. И эту возможность мы сейчас и рассмотрим в следующем разделе.