Лабораторная работа 9-05
Вид материала | Лабораторная работа |
- Методические указания к лабораторным работам Лабораторная работа, 357.24kb.
- Лабораторная работа №3 кпк лабораторная работа №3 Тема: карманный персональный компьютер, 173.34kb.
- Методические возможности стенда Особенности работы на стендах уилс-1 Ознакомительное, 1487.3kb.
- Лабораторная работа по курсу «Физические основы микроэлектроники», 136.21kb.
- Лабораторная работа, 166.92kb.
- Самостоятельная работа по учебным пособиям, 471.48kb.
- Конспект урока в 9 классе по теме: «Магний», 84.54kb.
- Лабораторная работа №1 Введение в Windows. Работа с окнами и приложениями в Windows, 67.41kb.
- Знакомство c Excel, 1212.51kb.
- Лабораторная работа, 105.21kb.
- -
Веб - технологии
Лабораторная работа 9-02
Использование форм в Web – страницах ( создание клиентского сценария на " onclick="return false">
1. Цель работы
Целью работы является овладение навыками работы с формами при создании интерактивных Web-страниц с использованием языка сценариев " onclick="return false">
2. Состав рабочего места
2.1. Оборудование: IBM-совместимый персональный компьютер (ПК).
2.2. Программное обеспечение: операционная система Windows, Web-браузер Internet Explorer версии 4.0 и выше.
3. Краткие теоретические сведения
3.1. Объект window в " onclick="return false">
Все Web-браузеры выводят пользователям Web-странице в окне дисплея. Любой, элемент, выводимый на экране, также содержится внутри окна. Объект window представляет текущее окно Web-браузера или отдельный фрейм, если окно разделено на фреймы. Этот объект является в " onclick="return false">
Объект window создается при открытии нового окна в Web-браузере но, в отличие от других объектов " onclick="return false">
Объект window имеет следующие свойства, общие для Internet Explorer и Netscape Navigator:
Свойство
Описание
closed
Возвращает true, если текущее окно закрыто. Может быть использовано при работе с несколькими окнами.
defaultStatus
Сообщение по умолчанию, отображаемое в строке состояния окна.
length
Возвращает количество фреймов.
location
Возвращает ссылку на объект location документа, загруженного в текущее окно.
name
Возвращает имя окна или фрейма.
opener
Возвращает ссылку на окно, которое открыло текущее окно, например, методом open().
parent
Возвращает ссылку на родительское окно, если текущий объект window представляет собой фрейм. В противном случае возвращается ссылка на само это окно.
screen
Возвращает ссылку на объект screen.
self
Возвращает ссылку на объект window текущего окна.
status
Текст, отображаемый в строке состояния окна Web-браузера.
top
Возвращает ссылку на родительское окно самого верхнего уровня, если текущий объект window представляет собой фрейм. В противном случае возвращается ссылка на само это окно.
window
То же, что и self.
Для определения текущей высоты и ширины окна в Internet Explorer используются свойства document.body.clientHeight и document.body.clientWidth, а в Netscape Navigator – свойства объекта window: innerHeight и innerWidth.
Координаты x и y левого верхнего угла текущего окна задаются в Internet Explorer с помощью свойств screenLeft и screenTop объекта window, а в Netscape Navigator – с помощью свойств screenX и screenY объекта window.
Методы объекта window, общие для Internet Explorer и Netscape Navigator, представлены в следующей таблице.
Метод
Описание
blur()
Удаляет фокус с окна.
clearInterval(таймер)
Останавливает таймер, установленный методом setInterval().
clearTimeout(таймер)
Останавливает таймер, установленный методом setTimeout().
close()
Закрывает текущее окно.
focus()
Переносит фокус на текущее окно.
moveBy(X, Y)
Перемещает окно на Х пикселей вправо и на Y пикселей вниз. Для перемещения влево и вверх задаются отрицательные значения Х и Y.
moveTo(X, Y)
Перемещает окно в точку экрана, заданную координатами Х и Y.
open(адрес, имя-окна, [список-свойств])
Открывает новое окно Web-обозревателя, загружает в него документ, адрес которого передан в первом параметре, и присваивает окну имя, переданное во втором параметре. В третьем параметре может быть передан список свойств окна (их описание приведено ниже).
print()
Выводит содержимое окна на принтер.
resizeBy(X, Y)
Увеличивает окно на Х пикселей по горизонтали и на Y пикселей по вертикали. Для уменьшения окна задаются отрицательные значения Х и Y.
resizeTo(X, Y)
Увеличивает или уменьшает окно до размера, заданного значениями Х и Y.
scrollBy(X, Y)
Прокручивает содержимое окна на Х пикселей вправо и на Y пикселей вниз. Для прокрутки влево и вверх задаются отрицательные значения Х и Y.
scrollTo(X, Y)
Прокручивает содержимое окна в точку, заданную значениями Х и Y.
setInterval(функция-или-выражение, интервал, [список аргументов функции, разделенных запятыми])
Вычисляет значение выражения или вызывает функцию каждый раз по истечении заданного интервала (в миллисекундах). Может передавать в функцию заданные в списке аргументы. Возвращает указатель на объект таймера, который можно использовать в методе clearInterval() для остановки и уничтожения таймера.
setTimeout(функция-или-выражение, интервал, [список аргументов функции, разделенных запятыми])
Вычисляет значение выражения или вызывает функцию по истечении заданного интервала (в миллисекундах), если до этого не был вызван метод clearTimeout(). Может передавать в функцию заданные в списке аргументы. Возвращает указатель на объект таймера, который можно использовать в методе clearTimeout() для остановки и уничтожения таймера.
showModalDialog(адрес, аргументы, список-свойств)
Открывает модальное диалоговое окно. Первый параметр задает URL адрес Web-страницы с формой, которая будет показана в модальном Web-окне. Второй параметр задает список аргументов, которые будут переданы в модальное Web-окно. Возможные значения третьего параметра описаны ниже.
showModelessDialog
(адрес, аргументы, список-свойств)
Открывает немодальное диалоговое окно. Первый параметр задает URL адрес Web-страницы с формой, которая будет показана в модальном Web-окне. Второй параметр задает список аргументов, которые будут переданы в модальное Web-окно. Возможные значения третьего параметра описаны ниже.
Ниже приводятся общие для Internet Explorer и Netscape Navigator свойства окна, передаваемые методу open():
Свойство окна
Описание
height=высота
Задает высоту создаваемого окна в пикселях.
location=yes | no
Включает или отключает отображение панели адреса, включающего строку ввода адреса, у создаваемого окна.
menubar=yes | no
Включает или отключает отображение строки меню у создаваемого окна
resizable=yes | no
Включает или отключает возможность изменения размера создаваемого окна.
scrollbars=yes | no
Включает или отключает отображение полос прокрутки у создаваемого окна.
status=yes | no
Включает или отключает отображение строки состояния у создаваемого окна.
toolbar=yes | no
Включает или отключает отображение панели инструментов у создаваемого окна.
width=ширина
Задает ширину создаваемого окна в пикселях.
Свойства, задающие координаты x и y левого верхнего угла создаваемого окна в Internet Explorer и Netscape Navigator называются по-разному: top и left – в Internet Explorer, screenX и screenY – в Netscape Navigator.
Если значение первого параметра функции open() равно пустой строке, создается новое окно с пустым содержимым. Для того, чтобы задать содержимое нового окна, используются методы open(), write(), writeln() и close() объекта document.
Довольно часто возникает задача передачи некоторых параметров от открывающего окна открываемому окну и/или передача параметров из отрываемого окна открывшему его окну. В Internet Explorer для этого можно использовать два метода: showModalDialog и showModelessDialog, которые обеспечивают работу соответственно с модальными и немодальными диалоговыми окнами.
Модальными диалоговыми окнами в Windows называются окна, отображаемые поверх других окон этого же приложения и не дающие пользователю перейти в них, пока он не выполнит некоторое действие.
Чтобы закрыть такое окно, пользователь должен либо ввести какие-то данные и нажать кнопку OK, либо отказаться от ввода и нажать кнопку Отмена (Cancel) или кнопку закрытия окна (если она есть). Модальные окна очень часто используются в приложениях Windows для того, чтобы запросить у пользователя ввод каких-либо данных, необходимых для продолжения работы с приложением.
Немодальными называются диалоговые окна, позволяющие пользователю переключаться в другие окна приложения. Они используются не так часто, как модальные, в основном, для того, чтобы позволить пользователю вводить и изменять какие-либо параметры приложения, не являющиеся критически важными. Как правило, немодальное диалоговое окно «плавает» поверх основного окна; при любом изменении данных пользователем информация в главном окне тотчас обновляется.
Netscape Navigator не поддерживает методы showModalDialog и showModelessDialog и не имеет аналогичных методов.
Дополнительные свойства поддержки модальных окон объекта window приведены в следующей таблице:
Свойство
Описание
dialogArguments
Возвращает значение или массив значений, переданных модальному Web-окну при его создании методом window.open(). Доступно только в модальных окнах.
dialogHeight
Высота модального окна.
dialogLeft
Горизонтальная координата левого верхнего угла модального окна.
dialogTop
Вертикальная координата левого верхнего угла модального окна.
dialogWidth
Ширина модального окна.
returnValue
Возвращает значение или массив значений, переданных модальным окном.
В параметре список-свойств, задаваемых для модальных и немодальных окон можно задать следующие свойства:
Свойство окна
Описание
center=yes|no
Если yes, то создаваемое окно будет находиться в центре экрана. Значение по умолчанию – yes. Можно также использовать 1 и 0 или on и off.
dialogHeight: значение
Высота создаваемого окна.
dialogHide=yes|no
Если yes, то создаваемое окно будет скрываться при печати или предварительном просмотре. Значение по умолчанию – no. Можно также использовать 1 и 0 или on и off.
dialogLeft: значение
Горизонтальная координата левого верхнего угла создаваемого окна.
dialogTop: значение
Вертикальная координата левого верхнего угла создаваемого окна.
dialogWidth: значение
Ширина создаваемого окна.
edge=sunken|raised
Задает вид границы окна: вдавленный (sunken) или выпуклый (raised). Значение по умолчанию – raised.
help=yes|no
Если yes, то создаваемое окно будет отображать в строке заголовка кнопку вызова контекстной справки. Значение по умолчанию – yes.
resizable=yes|no
Если yes, то пользователь сможет изменять размеры создаваемого окна. Значение по умолчанию – no.
scroll=yes|no
Если yes, то создаваемое окно будет отображать полосы прокрутки, если содержимое в нем не помещается. Значение по умолчанию – yes.
status=yes|no
Если yes, то создаваемое окно будет отображать строку состояния. Значение по умолчанию может в разных случаях быть различным, поэтому лучше задать это свойство явно.
unadorned=yes|no
Если yes, то создаваемое окно будет "не украшено". Значение по умолчанию – no.
Обмен параметрами можно выполнить и при открытии нового окна с помощью метода open(). Для этого значениям элементов документа, загруженного в новом окне необходимо присвоить требуемые значения, используя методы объектной модели документа. При обращении необходимо на первом уровне указать идентификатор созданного при открытии окна объекта.
Для передачи параметров из вызывающего окна можно использовать свойство opener объекта window.
Свойство | Описание |
closed | Возвращает true, если текущее окно закрыто. Может быть использовано при работе с несколькими окнами. |
defaultStatus | Сообщение по умолчанию, отображаемое в строке состояния окна. |
length | Возвращает количество фреймов. |
location | Возвращает ссылку на объект location документа, загруженного в текущее окно. |
name | Возвращает имя окна или фрейма. |
opener | Возвращает ссылку на окно, которое открыло текущее окно, например, методом open(). |
parent | Возвращает ссылку на родительское окно, если текущий объект window представляет собой фрейм. В противном случае возвращается ссылка на само это окно. |
screen | Возвращает ссылку на объект screen. |
self | Возвращает ссылку на объект window текущего окна. |
status | Текст, отображаемый в строке состояния окна Web-браузера. |
top | Возвращает ссылку на родительское окно самого верхнего уровня, если текущий объект window представляет собой фрейм. В противном случае возвращается ссылка на само это окно. |
window | То же, что и self. |
Метод | Описание |
blur() | Удаляет фокус с окна. |
clearInterval(таймер) | Останавливает таймер, установленный методом setInterval(). |
clearTimeout(таймер) | Останавливает таймер, установленный методом setTimeout(). |
close() | Закрывает текущее окно. |
focus() | Переносит фокус на текущее окно. |
moveBy(X, Y) | Перемещает окно на Х пикселей вправо и на Y пикселей вниз. Для перемещения влево и вверх задаются отрицательные значения Х и Y. |
moveTo(X, Y) | Перемещает окно в точку экрана, заданную координатами Х и Y. |
open(адрес, имя-окна, [список-свойств]) | Открывает новое окно Web-обозревателя, загружает в него документ, адрес которого передан в первом параметре, и присваивает окну имя, переданное во втором параметре. В третьем параметре может быть передан список свойств окна (их описание приведено ниже). |
print() | Выводит содержимое окна на принтер. |
resizeBy(X, Y) | Увеличивает окно на Х пикселей по горизонтали и на Y пикселей по вертикали. Для уменьшения окна задаются отрицательные значения Х и Y. |
resizeTo(X, Y) | Увеличивает или уменьшает окно до размера, заданного значениями Х и Y. |
scrollBy(X, Y) | Прокручивает содержимое окна на Х пикселей вправо и на Y пикселей вниз. Для прокрутки влево и вверх задаются отрицательные значения Х и Y. |
scrollTo(X, Y) | Прокручивает содержимое окна в точку, заданную значениями Х и Y. |
setInterval(функция-или-выражение, интервал, [список аргументов функции, разделенных запятыми]) | Вычисляет значение выражения или вызывает функцию каждый раз по истечении заданного интервала (в миллисекундах). Может передавать в функцию заданные в списке аргументы. Возвращает указатель на объект таймера, который можно использовать в методе clearInterval() для остановки и уничтожения таймера. |
setTimeout(функция-или-выражение, интервал, [список аргументов функции, разделенных запятыми]) | Вычисляет значение выражения или вызывает функцию по истечении заданного интервала (в миллисекундах), если до этого не был вызван метод clearTimeout(). Может передавать в функцию заданные в списке аргументы. Возвращает указатель на объект таймера, который можно использовать в методе clearTimeout() для остановки и уничтожения таймера. |
showModalDialog(адрес, аргументы, список-свойств) | Открывает модальное диалоговое окно. Первый параметр задает URL адрес Web-страницы с формой, которая будет показана в модальном Web-окне. Второй параметр задает список аргументов, которые будут переданы в модальное Web-окно. Возможные значения третьего параметра описаны ниже. |
showModelessDialog (адрес, аргументы, список-свойств) | Открывает немодальное диалоговое окно. Первый параметр задает URL адрес Web-страницы с формой, которая будет показана в модальном Web-окне. Второй параметр задает список аргументов, которые будут переданы в модальное Web-окно. Возможные значения третьего параметра описаны ниже. |
Свойство окна | Описание |
height=высота | Задает высоту создаваемого окна в пикселях. |
location=yes | no | Включает или отключает отображение панели адреса, включающего строку ввода адреса, у создаваемого окна. |
menubar=yes | no | Включает или отключает отображение строки меню у создаваемого окна |
resizable=yes | no | Включает или отключает возможность изменения размера создаваемого окна. |
scrollbars=yes | no | Включает или отключает отображение полос прокрутки у создаваемого окна. |
status=yes | no | Включает или отключает отображение строки состояния у создаваемого окна. |
toolbar=yes | no | Включает или отключает отображение панели инструментов у создаваемого окна. |
width=ширина | Задает ширину создаваемого окна в пикселях. |
Свойство | Описание |
dialogArguments | Возвращает значение или массив значений, переданных модальному Web-окну при его создании методом window.open(). Доступно только в модальных окнах. |
dialogHeight | Высота модального окна. |
dialogLeft | Горизонтальная координата левого верхнего угла модального окна. |
dialogTop | Вертикальная координата левого верхнего угла модального окна. |
dialogWidth | Ширина модального окна. |
returnValue | Возвращает значение или массив значений, переданных модальным окном. |
Свойство окна | Описание |
center=yes|no | Если yes, то создаваемое окно будет находиться в центре экрана. Значение по умолчанию – yes. Можно также использовать 1 и 0 или on и off. |
dialogHeight: значение | Высота создаваемого окна. |
dialogHide=yes|no | Если yes, то создаваемое окно будет скрываться при печати или предварительном просмотре. Значение по умолчанию – no. Можно также использовать 1 и 0 или on и off. |
dialogLeft: значение | Горизонтальная координата левого верхнего угла создаваемого окна. |
dialogTop: значение | Вертикальная координата левого верхнего угла создаваемого окна. |
dialogWidth: значение | Ширина создаваемого окна. |
edge=sunken|raised | Задает вид границы окна: вдавленный (sunken) или выпуклый (raised). Значение по умолчанию – raised. |
help=yes|no | Если yes, то создаваемое окно будет отображать в строке заголовка кнопку вызова контекстной справки. Значение по умолчанию – yes. |
resizable=yes|no | Если yes, то пользователь сможет изменять размеры создаваемого окна. Значение по умолчанию – no. |
scroll=yes|no | Если yes, то создаваемое окно будет отображать полосы прокрутки, если содержимое в нем не помещается. Значение по умолчанию – yes. |
status=yes|no | Если yes, то создаваемое окно будет отображать строку состояния. Значение по умолчанию может в разных случаях быть различным, поэтому лучше задать это свойство явно. |
unadorned=yes|no | Если yes, то создаваемое окно будет "не украшено". Значение по умолчанию – no. |