Интернет Университет информационных технологий  Расскажи
про свой ВУЗ!
www.intuit.ru
мои курсы мои настройки моя корзина помощь
  Лекции
Введение в JavaScript
(архив: ZIP)
1.   Назначение и применение JavaScri...
2.   Программируем свойства окна брау...
3.   Программируем формы
4.   Программируем графику
5.   Программируем гипертекстовые пер...
6.   Программируем "за кадром"
    Экзамен
    Сдать экзамен экстерном
    Литература

  Общение
однокурсники
форум по курсу
вопрос преподавателю
мнения о курсе

Введение в JavaScript
Лекция #6: Программируем "за кадром"
Страницы: « | 1 | 2 | 3 | 4 | 5 | 6 | 7 | вопросы | » | HTML для печати | PDF | ZIP
  Если Вы заметили ошибку на этой странице - сообщите нам.  

Управление фокусом

Фокус — это характеристика текущего окна, фрейма или поля формы. В каждом из разделов, описывающем программирование этих объектов, мы, так или иначе, касаемся вопроса фокуса. Под фокусом понимают возможность активизации свойств и методов объекта. Например, окно в фокусе, если оно является текущим, т.е. лежит поверх всех других окон и исполняются его методы или можно получить доступ к его свойствам.

В данном разделе мы рассмотрим управление фокусом в

  • окнах;
  • фреймах;
  • полях формы.

Следует сразу заметить, что фреймы — это тоже объекты класса Window, и многие решения, разработанные для окон, справедливы и для фреймов.

Управляем фокусом в окнах

Для управления фокусом у объекта класса "окно" существует два метода: focus() и blur(). Первый передает фокус в окно, в то время как второй фокус из окна убирает. Рассмотрим простой пример:

function hide_window()
{
wid=window.open("","test","width=400,height=200");
wid.opener.focus();
wid.document.open();
... wid.document.close();
}

В данном примере новое окно открывается и сразу теряет фокус; прячется за основным окном-родителем. Если при первичном нажатии на кнопку оно еще всплывает и только после этого прячется, то при повторном нажатии пользователь не видит появления нового окна, так как оно уже открыто и меняется только его содержимое.

Для того чтобы этого не происходило, нужно после открытия передавать фокус на новое окно:

function visible_window()
{
wid=window.open("","test","width=400,height=200");
wid.focus();
wid.document.open();
... wid.document.close();
}

Если теперь нажимать попеременно кнопки "Скрытое окно" и "Видимое окно", окно будет то появляться, то исчезать. При этом новых окон не появляется, так как с одним и тем же именем может быть открыто только одно окно.

Невидимое окно может доставить пользователю неприятности, из которых самая безобидная — отсутствие реакции на его действия. Код просто записывается в невидимое окно. Но ведь в скрытом окне можно что-нибудь и запустить. Для этого стоит только проверить, существует ли данное окно или нет, и если оно есть и не в фокусе, то активизировать в нем какую-нибудь программу.

Для реализации такого сценария достаточно использовать метод окна onblur(). Его можно также задать в контейнере BODY в качестве обработчика события onBlur, но в этом случае он видим пользователю. Мы воспользуемся этим методом "в лоб":

window.onblur = new Function("window.defaultStatus = 'Background started...';");
window.onfocus = new Function("window.defaultStatus = 'Document:Done';");

Обратите внимание на поле статуса браузера. Оно демонстрирует возможность выполнения функции в фоновом режиме. Кроме того, onblur() в этом виде не отрабатывает в Internet Explorer. Причина кроется в прототипе объекта и возможности его переназначения программистом.

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

Управление фокусом во фреймах

Фрейм — это такое же окно, как и само окно браузера. Точнее — это объект того же класса. К нему применимы те же методы, что и к обычному объекту "окно":

var flag=1;
function clock()
{
if(flag==0)
{
d=new Date();
s=d.getHours()+':'+d.getMinutes()+':'+d.getSeconds();
window.document.forms[0].elements[0].value=s;
}
setTimeout('clock();',100);
}
window.onblur = new Function('this.flag = 1;');
window.onfocus = new Function('this.flag = 0;');
window.onload = clock;

Данный фрагмент кода размещен в каждом из двух фреймов, которые отображаются в примере. А их именно два. Просто ширина границы набора фреймов установлена в 0. Если окно примера разделить мысленно пополам и "кликнуть" мышью в одну из половин, то пойдут часы в этой половине. Если теперь переместиться в другой фрейм и "кликнуть" мышью в нем, то часы пойдут в поле формы этого фрейма, а в другом фрейме остановятся.

Фокус в полях формы

Управление фокусом в полях формы, кроме этого раздела, описано еще и в разделе "Текст в полях ввода". Здесь мы рассматриваем этот вопрос в контексте общего применения методов blur() и focus(). Эти методы определены для любого поля формы, а не только для полей ввода. Рассмотрим простой пример.

Попробуйте изменить в этой форме значение любого из полей. Вряд ли это вам удастся. Обработчик события Focus (onFocus) уводит фокус из поля на произвольное место страницы.

Перейти к следующей странице »
  Если Вы заметили ошибку на этой странице - сообщите нам.  
Страницы: « | 1 | 2 | 3 | 4 | 5 | 6 | 7 | вопросы | » | HTML для печати | PDF | ZIP
  Спецпредложения
Для тех, кто желает поддержать проект:
Майки с символикой INTUIT.ru
Все книги+CD со скидкой более 60%
 
  Ключевые слова
Типы данных, модель безопасности, прототипы, объекты, функции, процедуры, обмен данными, счетчики.
 
  Информация о лекции
В этой лекции рассматриваются приемы программирвания на JavaScript, невидимые для читателей HTML-страниц. Рассматриваются принципы работы счетчиков посещаемости, работы с механизмом cookie и многое другое.
 
  Учебники к курсу
Основы web-технологий
Основы web-технологий
Храмцов П.Б., Брик С.А., Русак А.М., Сурин А.И.,
Интернет-университет информационных технологий - ИНТУИТ.ру.
Курс лекций посвящен основам Web-технологий. В его рамках рассматриваются язык гипертекстовой разметки HTML, язык программирования динамического контента JavaScript, спецификация разработки прикладного программного обеспечения CGI и спецификация описания стилей представления информации CSS.
все книги по курсу »