
- •Лекция: Назначение и применение JavaScript, общие сведения
- •Способ 1: url-схема "JavaScript:"
- •Способ 2: обработчики событий
- •Способ 3: подстановки
- •Размещение кода внутри html-документа
- •Условная генерация html-разметки на стороне браузера
- •Комментарии в html и JavaScript
- •Указание языка сценария
- •Регистр символов
- •Лекция: Типы данных и операторы
- •Массивы
- •Метод join()
- •Метод reverse()
- •Метод sort()
- •Операторы языка
- •Лекция: Функции и объекты
- •Функции
- •Функция как тип данных
- •Функция как объект
- •Коллекции
- •Cвойства
- •События
- •Пользовательские объекты
- •Понятие пользовательского объекта
- •Прототип
- •Методы объекта Object
- •Лекция: Программируем свойства окна браузера Объект window
- •Свойства объекта window Поле статуса и свойство window.Status
- •Программируем status
- •Программируем defaultStatus
- •Поле адреса и свойство window.Location
- •Свойства объекта location
- •Методы объекта location
- •История посещений (history)
- •Тип браузера (navigator)
- •Методы объекта window
- •Методы focus() и blur()
- •Метод setTimeout()
- •Метод clearTimeout()
- •Методы setInterval() и clearInterval()
- •Фреймы (Frames)
- •Иерархия и именование фреймов
- •Коллекция фреймов
- •Передача данных во фрейм
- •Лекция: Программируем формы Контейнер form
- •Свойства объекта Form Свойство action
- •Свойство method
- •Свойство target
- •Свойство encoding
- •Коллекция elements[]
- •Методы объекта Form Метод submit()
- •Метод reset()
- •События объекта Form Событие Submit
- •Событие Reset
- •Поля формы и их объекты
- •Текстовое поле ввода (объект Text)
- •Списки вариантов (объекты Select и Option)
- •Создание объектов Option
- •Коллекция options[]
- •Свойства text и value объекта Option
- •Свойства selected и selectedIndex
- •Обработчик события onChange объекта Select
- •Кнопка button
- •Кнопка submit
- •Метод submit() формы
- •Кнопка reset
- •Графическая кнопка
- •6. Лекция: Программируем гипертекстовые переходы
- •Замена атрибута href
- •Изменение части url
- •События MouseOver и MouseOut
- •Обработка события Click
- •Лекция: Программируем графику Объект Image
- •Свойства src и lowSrc
- •Изменение картинки
- •Мультипликация
- •Обработчик события onLoad
- •Запуск и остановка мультипликации
- •Оптимизация отображения
- •Оптимизация при загрузке изображений
- •Предварительная загрузка изображений
- •Нарезка изображений
- •Графика и таблицы
- •Горизонтальное меню
- •Вертикальное меню
- •Выделение выбранного пункта меню
- •Вложенные меню
- •Лекция: Программируем "за кадром" Механизм cookie
- •Что такое cookie
- •Чтение cookie
- •Создание или изменение cookie
- •Удаление cookie
- •Демонстрационный пример
- •Управление фокусом
- •Управляем фокусом в окнах
- •Управление фокусом во фреймах
- •Фокус в полях формы
- •Скрытая передача данных из форм
- •Невидимый код
- •Невидимый фрейм
- •Код во внешнем файле
- •Обмен данными посредством встроенной графики
- •Модель безопасности
Методы focus() и blur()
Метод focus() применяется для передачи фокуса в окно, с которым он использовался. Передача фокуса полезна как при открытии окна, так и при его закрытии, не говоря уже о случаях, когда нужно выбирать окна. Рассмотрим пример.
Открываем окно и, не закрывая его, снова откроем окно с таким же именем, но с другим текстом. Новое окно не появилось поверх основного окна, так как фокус ему не был передан. Теперь повторим открытие окна, но уже с передачей фокуса:
<HTML>
<HEAD>
<SCRIPT>
function myfocus(a)
{
myWin = window.open('','example','width=300,height=200');
// открываем окно и заводим переменную с указателем на него.
// Если окно с именем 'example' существует, то новое окно не создается,
// а открывается поток для записи в имеющееся окно с именем 'example'
if(a==1)
{
myWin.document.open(); //открываем поток ввода в уже созданное окно
myWin.document.write('<H1>Открыли окно в первый раз'); //Пишем в этот поток
}
if(a==2)
{
myWin.document.open();
myWin.document.write('<H1>Открыли окно во второй раз');
}
if(a==3)
{
myWin.focus(); // передаем фокус, а затем выполняем те же действия,
// что и в предыдущем случае
myWin.document.open();
myWin.document.write('<H1>Открыли окно в третий раз');
}
myWin.document.write('</H1>');
myWin.document.close();
}
</SCRIPT>
</HEAD>
<BODY>
<a href="javascript:myfocus(1);">Откроем окно и напишем в него что-то</a>,
<BR><BR>
<a href="javascript:myfocus(2);">напишем в него же что-то другое, но фокус не передадим</a>,
<BR><BR>
<a href="javascript:myfocus(3);">опять что-то напишем в него, но сперва передав ему фокус</a>.
</BODY>
</HTML>
Пример 4.1. Передача фокуса в новое окно (html, txt)
Поскольку мы пишем содержание нового окна из окна старого (родителя), то в качестве указателя на объект используем значение переменной myWin.
Чтобы
увести фокус из определенного окна myWin,
необходимо применить метод myWin.blur().
Например, чтобы увести фокус с текущего
окна, где выполняется скрипт, нужно
вызвать window.blur().
Эффект будет тот же, как если бы
пользователь сам свернул окно нажатием
кнопки
в
правом верхнем углу окна.
Метод setTimeout()
Метод setTimeout() используется для создания нового потока вычислений, исполнение которого откладывается на время (в миллисекундах), указанное вторым аргументом:
idt = setTimeout("JavaScript_код",Time);
Типичное применение этой функции - организация периодического изменения свойств объектов. Например, можно запустить часы в поле формы:
<HTML><HEAD><SCRIPT>
var Chasy_idut=false;
function myclock()
{
if(Chasy_idut)
{
d = new Date();
document.f.c.value =
d.getHours()+':'+
d.getMinutes()+':'+
d.getSeconds();
}
setTimeout("myclock();",500);
}
function FlipFlag()
{
Chasy_idut = !Chasy_idut;
document.f.b.value = (Chasy_idut)?
'Остановить' : 'Запустить';
}
</SCRIPT></HEAD>
<BODY onLoad="myclock();">
<FORM NAME=f>
Текущее время:<INPUT NAME=c size=8>
<INPUT TYPE=button name=b VALUE="Запустить"
onClick="FlipFlag();">
</FORM></BODY></HTML>
Пример 4.2. Часы с использованием setTimeout() (html, txt)
Обратите внимание, что поток порождается (т.е. вызывается setTimeout() ) всегда, даже в том случае, когда мы остановили показ часов. Если бы он создавался только при значении переменнойChasy_idut = true, то часы бы просто не запустились, так как в самом начале исполнения скрипта мы установили var Chasy_idut = false. Но даже если бы мы установили в начале var Chasy_idut = true, то часы бы запустились при загрузке страницы, а после остановки поток бы исчез, и при последующем нажатии кнопки "Запустить" часы продолжали бы стоять.