Структурно-логическое проектирование Web -узлов

Вид материала

Лекции

Содержание ИмяФормы.ИмяЭлементаУправления.Свойство [Метод] Основы Dynamic HTML

Подобный материал:

• Рабочая программа по дисциплине «Структурно-логическое проектирование» Дополнительной, 84.66kb.
• Сценарий занятия «html-проектирование: Достопримечательности Мурманской области», 72.96kb.
• План занятий Web взгляд изнутри. Вводная часть в курс. Web-страницы, web-сайты, web, 11.42kb.
• Тема урока: Создание Web страниц с помощью html, 39.83kb.
• Структурно- логическое развитие теории и методологии планирования в управлении современной, 506.8kb.
• В. К. Толстых учебное пособие администрирование сервера iis 5 Донецк, Донну 2004 министерство, 663.13kb.
• Тема: Создание Web-документа с помощью Microsoft Word, 137.29kb.
• Рабочая программа профессионального модуля, 567.99kb.
• Методические указания по выполнению курсовой работы по дисциплине "web-графика и web-дизайн", 115.21kb.
• Современный web-дизайн, 106.2kb.

Дoбpo пожаловать на мою Web-страничку!

8. Наборы документов
   

Помимо цвета фона, объект Document предоставляет доступ ко многим элементам страницы. Этот доступ обычно осуществляется при помощи набора (collection), объекта особого вида из объектной модели Internet Explorer. Набор представляет собой группу объектов одного класса и позволяет легко получить доступ к любому члену класса. Например, при помощи набора Forms можно обратиться к любой или ко всем формам документа и выполнить с ними определенные операции. В число этих операций входит проверка правильности данных в полях и отправка формы. К элементам управления, в свою очередь, можно обратиться посредством формы, которая их содержит. Обобщая, скажем, что к лю­бым свойствам и методам элемента управления, содержащегося в фор­ме, можно получить доступ при помощи объектов Document и Form сле­дующим образом:

Document .ИмяФормы.ИмяЭлементаУправления.Свойство [Метод]

Чтобы попрактиковаться в работе с формами и элементами управ­ления в VBScript, давайте разработаем простую форму с проверкой пра­вильности полей на клиентской стороне. Предположим, что у нас есть форма под названием frmValidate с двумя текстовыми полями ввода в HTML-таблице. Одно из полей — txtDate — используется для ввода даты. Поскольку способов ввести дату существует великое множество, пе­ред отправкой формы корректность введенной даты нужно проверить. В данном случае для вызова процедуры проверки воспользуемся собы­тием OnClick простой HTML-кнопки. В обработчике события OnClick вызовем функцию VBScript IsDate. Эта функция возвращает true, если значение в поле ввода представляет собой корректную дату. Конечно, здесь имеется в виду синтаксическая, а не смысловая корректность. Но ничто не мешает написать проверку и смысловой корректности дат. Полный код приведен в листинге 4.

Листинг 10.8. Проверка правильности введенных данных в форме.



<МЕТА NAME="GENERATOR" Content="Microsoft Developer Studio">

Имя
Дата
If blnDirection = 0 Then lngColor = lngColor - &H110000 If lngColor < 0 Then lngColor =0 Else intTimeout = SetTimeout("FadeText(0)", 50) End If Else lngColor = lngColor + &H110000 If lngColor > &HFF0000 Then lngColor = &HFF0000 Else intTimeout = SetTimeout("FadeText(-1)", 50) End If End If htmlFade.Color = Hex('lngColor) End Sub --> Проявляющийся текст Ключевой момент в динамическом изменении содержимого Web-страницы состоит в том, что каждый тег рассматривается как отдельный объект. Поэтому этим тегам нужно присвоить имена, чтобы к ним мож­но было обращаться в коде. В предыдущем примере имя было присвое­но тегу , поскольку именно его атрибуты изменяются во время выполнения. Имя присваивается тегу указанием атрибута ID, как пока­зано в следующем фрагменте: Как только этот идентификатор определен, в коде на VBScript мож­но писать обработчики событий, которые могут происходить с данным тегом. Dynamic HTML поддерживает широкий спектр событий, включая такие известные, как Click, DblClick и KeyPress (Щелчок, Двойной щел­чок и Нажатие клавиши). Вот полный список: Abort Focus MouseOut Submit Blur KeyDown MouseOver Unload Click KeyPress MouseUp Change KeyUp Move DblClick Load Reset DragDrop MouseDown Resize Error MouseMove Select В предыдущем примере использовались события OnMouseOver и OnMouseOut, которые определяют, когда указатель мыши появляется над областью текста, находящейся внутри тега , и когда покидает ее. Когда соответствующее событие произошло, при помощи метода SetTimeout создается цикл анимации, плавно изменяю­щий цвет текста на красный или черный. Dynamic HTML обрабатывает события на нескольких уровнях, позво­ляя элементам-контейнерам получать уведомления, когда происходят события с содержащимися в них тегами. Этот процесс уведомлений но­сит название распространения события (event bubbling). Он позволяет в одном месте задать обработчик для большинства тегов Web-страницы, а также указать специальные действия для каждого конкретного тега. Распространение происходит автоматически и может быть перехваче­но любым объектом в иерархии. Если тег получает событие, объект Document автоматически получает это событие, как только тег заканчи­вает его обработку. Рассмотрим несколько примеров динамических страниц. Листинг 10.9. Обработка клика, двойного клика, нажатия, отпускания левой и правой кнопок мыши. Примеры обработки клика, двойного клика, нажатия, отпускания левой и правой кнопок мыши Одиночный клик onhelp="alert ('Дважды нажмите на ссылку, чтобы открыть документ.');return false" title="Нажмите F1 для подсказки." ondblclick="self.location.href= 'other_page.php'"> Двойной клик onhelp="alert ('Дважды нажмите на ссылку, чтобы открыть документ.');return false" title="Нажмите F1 для подсказки." ondblclick="self.location.href= 'other_page.php'"> Двойной клик Нажатие Отпускание Нажатие правой кнопки Листинг 10.10. Динамическое изменение тегов. (ex_3.php)