WWW.DISSERS.RU

БЕСПЛАТНАЯ ЭЛЕКТРОННАЯ БИБЛИОТЕКА

   Добро пожаловать!

Pages:     | 1 |   ...   | 6 | 7 || 9 | 10 |

«тм Ричард Вагнер, Вайк Исчерпывающее руководство об основном языке сценариев Своевременные для создания полнофункциональных Web-приложений Объектно-ориентированная Исследуется связь JavaScript с другими ...»

-- [ Страница 8 ] --

Аргументы: name - (string) Имя кнопки в "Start 0, file - (string) URL изображения "graphics/ "Start Slideshow", 0, alt - (string) Атрибут alt Навигация по сайту с использованием JavaScript Глава Кнопка отображается только, если значе- Затем формируется базовый который приравнива ние равно true. Если же равна ется к базовому URL текущего окна. Он сохраняется в false, отображается кнопка Start. Если кнопка Start до- переменной topBase и используется при генерации дес ступна и пользователь совершает на ней щелчок, в фун- криптора для нового документа с кции выполняется следующий код: ной панелью. Предполагается, что имя файла для уста навливающего фреймы HTML-документа длину = "start") { двенадцать символов, например, Это дол glsRunning = жно обеспечить согласование с версиями до Netscape = Navigator 3.0.

) ПРЕДУПРЕЖДЕНИЕ Значение переменной glsRunning установлено в true, Если ошибиться в определении базового URL для сге а инструментальная панель помещена в выбранный нерированного при помощи JavaScript HTML-докумен та, то версии Netscape Navigator до 3.0 не смогут Document. Текущая инструментальная панель понять некорректный URL.

удаляется и создается новая HTML-страница, содержа щая новую инструментальную панель, которая учиты Метод print() продолжает работу, вает новое состояние glsRunning. Это означает, что к целевому документу. Затем метод записывает каждую кнопка StartGrey будет доступной, а кнопка Start даже строку HTML, требуемую для формирования Web-стра не помещена на новую страницу. Это дает иллюзию ус ницы с инструментальной панелью. Для центрирования тановки запрета выбора кнопки "Start", тогда как на кнопок можно воспользоваться таблицей. Цикл for при самом деле это совсем другая кнопка. В листинге 28. меняется для последовательной записи каждой кнопки, показан метод print(), который отвечает за подготовку которая сохраняется в buttonSet. Если был задан сим новой HTML-страницы.

вол пробела, напечатается пустой графический символ Метод print() начинается с установки флажка isBusy и "размножится" до требуемого количества пикселов. На в true, что предотвращает нажатие пользователем других конец, документ закрывается и окно браузера обновля кнопок во время обновления инструментальной панели.

ется.

Листинг 28.5. Метод объекта buttonSet.

function t /* * Описание: Метод buttonSet.

* Аргументы: dobj - объект document, содержащий buttonSet.

*/ = var var = var topBase = var basePath = var baseDir = var baseFile = baseDir = j. open dObj.bgColor = HTML PUBLIC dObj href = кнопок, начиная со свойства с номером i.

Избранные программные технологии V i = > i;

i++) HREF = // Добавить пустое если это != 0) I I I = Обновление инструментальной панели [2] Как можно понять из сказанного выше, обновления инструментальной панели проводить легко, необходимо Приведенная строка кода вернет инструментальную только вызвать метод Просто установите глобаль- панель в предыдущее состояние после перехода к сле ные переменные, от которых зависят кнопки, и вызовите дующему слайду.

Документы в других фреймах могут также обнов- Если при переходе к следующему слайду устанавли лять инструментальную панель. Например, несложно ваются глобальные переменные и обновляется инстру изменить приложение Slide Show так, чтобы пользова- ментальная панель, исчезает необходимость обновления тель не смог запустить слайдовую демонстрацию, начи- инструментальной панели через обработчик событий ная с последнего слайда. Для этого потребуется добавить в Используя подобный подход, можно в каж метод clear() новую глобальную переменную с именем дом документе определять, какие кнопки отображать, к методу и установить ее равной false. зная, что эта информация будет сбрасываться каждый Затем необходимо изменить которая вызывается раз при загрузке следующего документа.

для кнопок Start и так, чтобы она учитывала Использование приложения Slide Show вновь появившуюся gCanStart. Новый код будет выгля деть следующим образом: На сопровождающем CD-ROM находится каталог, со держащий все файлы, необходимые для приложения Slide Show. Для активизации окна "Start && просто загрузите в браузер. Инструмен "graphics/ тальная панель используется здесь для передвижения по "Start 0, слайдам и по соответствующим их описаниям. Рисунок 28.1 демонстрирует, как приложение Slide Show выгля Затем потребуется вставить в раздел после дит после загрузки в браузер.

днего слайдового документа сценарий:

В программу входят пять слайдов. Инструментальную бражается соответствующим образом. Это кнопка И наконец, необходимо добавить еще один вызов StartGrey. После щелчка на кнопке Start (с изображе метода () объекта Toolbar, срабатывающий при вы нием стрелки вправо и эллипса) программа слайдовой ходе из документа:

Навигация по сайту с использованием Глава демонстрации начинает циклически проходить по каж- как навигационный инструмент или даже как справочное меню. Никакие модификации для этого не дой паре HTML-документов. На рис. 28.2 показан экран браузера в процессе слайдовой демонстрации. Обратите требуются. Просто передайте в метод print() объект внимание, что кнопка останова тогда как Document нового окна.

кнопка Start — нет.

Использование объекта History До сих пор рассматривались способы навигации по пред варительно созданным Web-страницам. Но что если на Web-странице необходимо обеспечить навигационные средства управления, которые обладали бы функцио нальными возможностями, характерными для инстру ментальных панелей браузеров? К счастью, JavaScript предоставляет специальный объект History, который позволяет передвигаться по Web-сайтам, которые бра узер отображал ранее. В том числе и по Web-страницам, которые создавали не вы. Объект History способен это делать, поскольку в нем хранится список всех посещен ных URL-адресов.

Для навигации по списку объект History име ет некоторые встроенные методы навигации вперед и РИСУНОК 28.1. панель приложения Slide назад. Метод back() загружает URL предыдущего посе Show.

щенного Web-сайта. Метод загружает следу ющий в списке посещений.

Кроме того, объект History имеет еще один метод и ряд свойств. К сожалению, из соображений безопасно сти многие браузеры не позволяют использовать допол нительный метод и свойства. В действительности, это with big ears.

не очень большой недостаток, поскольку большинство возможностей объекта History реализовано в методах back() и Для демонстрации применения объекта History сто ит создать страницу, которая содержит всего две навигационных кнопки. Одна кнопка будет пе реводить пользователя на предыдущий URL из списка посещений, а другая — на следующий URL в этом спис ке. Кнопки будут использовать свои обработчики собы тий onClick для вызова двух методов History, которые И т га обсуждались ранее. Код такой Web-страницы показан РИСУНОК 28.2. Слайд в процессе выполнения программы в листинге 28.6.

слайдовой демонстрации.

Листинг 28.6. Использование объекта History для Обсуждение дополнительных целей навигации.

возможностей объект buttonSet можно изменить еще боль 8 тм Ричард Вагнер, Вайк Исчерпывающее руководство об основном языке сценариев Своевременные для создания полнофункциональных Web-приложений Объектно-ориентированная Исследуется связь JavaScript с if == true) return self-destruct

in Bob's Music Store else return true To receive our free catalog by mail please enter your email address below.

код вызывает отображение диалогового окна подтверждения (рис. 29.3).

РИСУНОК Диалоговое окно подтверждения

При нажатии Cancel возвращается false, которое посту- пает в объект Form и препятствует отправке формы.

возможность ввода пользователем произволь-

ного значения:

Можно указать необязательный второй аргумент, текстовом поле ввода attributes. Текстовое поле ввода pattern обеспечивает место для ввода шаблона регуляр ного выражения, по которому выполняется поиск в или Pattern результат поиска/замены помещает

Функция поиска

После щелчка на кнопке Search for Pattern обработчик событий onClick вызывает функцию Эта функция передает конструктору шаблон, л также

= message;

First Name

size= Использование сообщения о состоянии Amount что сообщения в строке состояния в меньшей степени — они менее заметны. В листинге 29.2 показан пример использования дополнительной помощи во время вво Когда пользователь перемещает курсор на поле либо да данных.

же его автоматически помещает туда браузер, обработ Листинг 29.2 Отображение сообщения о состоянии чик событий onFocus вызывает функцию В сроке состояния выводится соответствующее сообщение за счет установки свойства status объекта Window. Фун Years of ( Compound Total

 Value:

Present

РИСУНОК 29.8 Форма сложных процентов скольку все процессы реализуются на стороне клиента.


 Заметьте, что вместо объекта Submit в форме использу Total Interest:  Web-браузер передает форму на сервер. Однако, по скольку требуется, чтобы процессы выполнялись на кли  ентской части, необходимо использовать обработчик событий onClick и функцию когда кнопка нажата. Для достижения большей степени реальности Создание повторно используемого кнопка была названа Calculate, тем не менее, ее назва ние вполне можно изменить и на Submit. До тех пор кода верификации пока пользователь не просмотрит исходный код страни цы, невозможно увидеть, что за HTML используется на В следующих разделах рассматриваются способы вери клиентской части и — на серверной ча- фикации наиболее общих типов данных, используемых сти. Код примера представлен в листинге 29.5. во время работы в Internet. Эти примеры применяются в библиотеках кодов, которые хранятся в отдельном Листинг 29.5 Вычисление сложных процентов файле либо в исходном документе с набором фреймов.

Во всех примерах в качестве одного из аргументов пе редается объект текстового элемента. Такая возможность Interest ет место для ввода строки, поиск которой осуществля ется по определенному шаблону. Текстовое поле ввода replaceString обеспечивает пространство для ввода стро

ки, используемой для замены частей searchString, где Expression Tester отыскивается соответствие. Значение из этого поля при board=0> меняется после щелчка на кнопке Replace Pattern. Та
информацию об атрибутах, введенную в HTML-форму, с целью создания объекта RegExp с именем regExpObj.

ну в поисковой строке, которая была введена в форму.

Результат поиска помещается в текстовое поле result.

Если же соответствие не найдено, упомянутое поле ос

pattern" ing.

Функция замены replaces После на кнопке Pattern обработчик со бытий onClick вызывает функцию replacePattern(). Эта result) функция передает конструктору шаблон, а также инфор

Функция очистки После щелчка на кнопке Clear обработчик событий onClick вызывает функцию Эта функция произво Тестер регулярных выражений можно условно раз- дит очистку всех текстовых полей.

бить на четыре основные части: пользовательский интер Выполнение поиска по шаблону с использованием регулярных выражений Глава но, что в Северной Каролине имеется только шесть ко Пример: программа проверки дов (828, 252, 704, 919, 910, то их можно задейство правильности ввода телефонных вать в шаблоне:

номеров Добавьте в основной шаблон, поместив Итак, читатели уже знакомы с регулярными выражения все возможные территориальные коды в круглые скоб ми, знают, как их создавать, а также имеют программу, ки и отделив каждый код вертикальной чертой. Верти поможет в определении шаблонов поиска. Но кальная черта означает, что должна предприниматься как применить регулярные выражения для решения ре попытка поиска значения справа или слева, т.е. логичес альных задач? В современном превалирует элек кая операция ИЛИ. Если пользователь вводит террито тронная коммерция. Поэтому огромную роль играет риальный код, определенный в списке, результат поис проверка ввода телефонных номеров, адресов и номеров ка будет положительным.

кредитных карточек. Многие виды проверок, например, Теперь, когда составлены все поисковые шаблоны кредитных карточек, должны выполняться на серверной для телефонных номеров Северной Каролины, потребу части, однако проверка статической информации может ется построить пользовательский интерфейс и протести проводиться и на стороне клиента. Один из видов ин ровать шаблоны. Если отыскивается шаблон в строке, формации, проверяемой на серверной части, связан с содержащей правильный телефонный номер, то возвра территориальными кодами. Поскольку они меняются не щается соответствующий телефонный номер. С другой очень часто, их можно поместить на Web-страницу и стороны, если ищется шаблон в строке с неправильным выполнять проверку с использованием регулярных вы телефонным номером, будет возвращен NULL. По на ражений в JavaScript.

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

перед тем, как разрешить пользователю продолжать ра боту. Предположим, что создается Web-сайт для компа нии North Caroline, торгующей различным хламом.

телефонного номера чем пользователь сможет продолжить составлять var new (areaCode + + следует убедиться, что компания имеет коррект prefix + + ный номер, относящийся к Северной Ка шаблона ролине. В противном случае могут возникнуть пробле поиск телефонного с мы с отгрузкой товара.

704, 919, Было бы разумно поместить все номера Северной Каролины на Web-страницу и с их помощью проверять var = / введенного номера. Однако можно прове рить правильность ввода территориального кода, который = null) должен относиться к Северной Каролине. Если клиент f alert (phoneNum + does not contain a valid допустил ошибку при вводе кода, его можно предупре Carolina area дить и предложить ввести номер Северной Каролины.

} Если же код правильный, формирование заказа можно else продолжить.

f you for your За счет использования поисковых шаблонов для те лефонных номеров Северной Каролины, можно быстро определить корректность номера введенного пользова Если добавить в функцию некоторый HTML-код, телем. Все телефонные номера состоят из трехцифрового полнофункциональная программа проверки территориального кода, за которым следует трехцифро телефонных номеров. В листинге представлен пол вая а за ней — расширение.

ный исходный код такой программы.

будет выглядеть следующим образом: ###-### Поскольку знак # обозначает цифру, можно при Листинг 31.2. Проверка введенного телефонного бегнуть к синтаксису регулярных выражений \d для циф номера. _ ры в этих позициях. Поисковый шаблон станет таковым:

8 тм Ричард Вагнер, Вайк Исчерпывающее руководство об основном языке сценариев Своевременные для создания полнофункциональных Web-приложений Объектно-ориентированная Исследуется связь JavaScript с Обратите внимание, что наклонная черта вправо ука-

© 2011 www.dissers.ru - «Бесплатная электронная библиотека»

Материалы этого сайта размещены для ознакомления, все права принадлежат их авторам.
Если Вы не согласны с тем, что Ваш материал размещён на этом сайте, пожалуйста, напишите нам, мы в течении 1-2 рабочих дней удалим его.