Добавил:
Upload Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз: Предмет: Файл:
Ajax_v_deystvii.pdf
Скачиваний:
34
Добавлен:
05.03.2016
Размер:
5.83 Mб
Скачать

460 Часть IV. Ajaxв примерах

tquote3tquote,10,387,1220,300, tquotehttp://radio.j avaranch.com/pascarellotquote, tquoteAjax Blog!tquote

)

>;

Поскольку мы уже вошли в систему, текстовое окно регистрации и кнопку "Отправить" можно убирать; вместо них отображается приветственное сообщение. Чтобы разместить это сообщение, необходимо будет скрыть содержимое, по умолчанию располагающееся на экране. Для этого свойство display элемента DOM defaultContent устанавливается равным попе, поэтому оно убирается из поля зрения пользователя.

Обрабатывающий окно оператор JavaScript состоит из двух частей. Первая часть представляет собой вызов функции CreateWindow(), являющейся частью добавленной нами библиотеки JavaScript. В вызове функции мы вызовем новый конструктор объекта. Конструктор создает класс окна, облегчающий обращение к свойствам окна. Функция JavaScript, создающая класс окна, должна получить параметры OKHaid, width, height, xPos, yPos, url и t i t l e . Когда сервлет возвратит эту строку клиенту, метод JavaScript eval () выполнит ее.

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

Использованная нами библиотека JavaScript создает плавающие окна JavaScript. Давайте посмотрим, как сделать эти функции создания окон доступными на стороне клиента.

11.4.3. Добавление внешней библиотеки JavaScript

Как отмечалось ранее, мы используем библиотеку DHTML, которую можно загрузить с Web-сайта www.manning.com. Файл JSWindow. js содержит все методы DOM JavaScript, необходимые для создания элементов окон. Кроме того, библиотека применяет обработчики событий к объектам окон, так что мы можем использовать возможности перетаскивания. Готовые библиотеки кода удобны тем, что позволяют сокращать время разработки и обычно работают во всех браузерах.

Первым делом требуется переименовать файл, чтобы мы могли модифицировать его. Запишем файл JavaScript под именем A j axWindow. j s в рабочей папке.

Чтобы использовать функции, содержащиеся в AjaxWindow. js, необходимо сослаться на внешний файл JavaScript посредством дескриптора script. В дескрипторе JavaScript element мы используем атрибут src. Элемент script, связывающийся с требуемым файлом . js, необходимо включить в заголовок нашей HTML-страницы.

<script type="text/javascript" src="AjaxWindow.js"X/script>

Рис. 11.12. Портал Ajax с тремя открытыми на экране окнами

Кроме того, нам потребуется таблица стилей окон DHTML, чтобы мы могли определить стилевое оформление окна. Для этого загрузите файл AjaxWindow.css с Web-сайта www.manning.com (или www.dialektika.com) и присоедините его к нашему сценарию, используя дескриптор link и атрибут href.

<link rel="stylesheet" type="text/css" href="AjaxWindows. css"x/link>

Итак, мы присоединили к HTML-странице файлы JavaScript и CSS, поэтому теперь можно проверить, правильно ли мы это сделали. Кроме того, проверим, правильно ли код серверной части сценария вызывает библиотеку JavaScript. Если код присоединен правильно и мы надлежащим образом получаем данные с сервера, то после входа в систему с использованием имени пользователя и пароля из базы данных мы, согласно хранимой в базе информации, должны получить три окна, показанных на рис 11.12. Помните, что созданная нами библиотечная функция формирует окна и связывает с ними все требуемые функциональные возможности. Выглядит, как волшебство, поскольку мы вызываем одну функцию, и все работает.

Открыв окна портала, можно проверить функциональные возможности, встроенные в библиотеку DHTML (функциональные возможности Ajax мы пока не рассматриваем). Вообще, в портале можно реализовать следующие дополнительные возможности.

Щелчок на кнопке с пометкой О максимизирует и минимизирует окно.

Щелчком на кнопке со знаком х окно можно скрыть.

Щелчком на кнопке с буквой w можно открыть окно DHTML в собственном раскрывающемся окне.

Соседние файлы в предмете [НЕСОРТИРОВАННОЕ]