Добавил:
Upload Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз: Предмет: Файл:
Web-технологии - ЛР №16.docx
Скачиваний:
2
Добавлен:
01.03.2025
Размер:
655.52 Кб
Скачать
  1. Свойства и методы объекта Element, применяемые для работы с элементами управления

А теперь обратимся к объекту Element библиотеки Ext Core и посмотрим, что он может предложить нам для работы с элементами управления.

Метод getValue возвращает значение, введенное в поле ввода или область редактирования, в виде строки или числа:

<экземпляр объекта Element>.getValue(<преобразовать в число>)

Если этому методу передать в качестве параметра значение false, он вернет значение поля ввода или области редактирования в виде строки. Если же ему передать значение true, он попытается преобразовать это значение в число и в случае успеха вернет его; в противном случае он вернет это значение в виде строки:

var sEmail = Ext.get("email").getValue(false);

Метод focus делает данный элемент управления активным. Он не принимает параметров и не возвращает результата. Если вызвать этот метод у элемента Web-страницы, не являющимся элементом управления, ничего не произойдет:

Ext.get("email").focus();

Метод blur делает данный элемент управления неактивным; при этом фокус ввода переносится на следующий в порядке обхода элемент управления:

Ext.get("email").blur();

Данный метод также не принимает параметров и не возвращает результата. Если вызвать его у элемента Web-страницы, не являющимся элементом управления, ничего не произойдет.

Метод select поддерживает еще один селектор — :checked. Он соответствует всем установленным флажкам и переключателям:

var clChecked = Ext.get("cmain").select(":checked");

  1. События элементов управления

Специфические события, поддерживаемые элементами управления, перечислены в табл. 16.1.

Таблица 16.1. Специфические события, поддерживаемые элементами управления

Элементы управления также поддерживают события dblclick, keydown, keypress, keyup, mousedown, mousemove, mouseout, mouseover и mouseup, описанные в табл. 13.1.

  1. Реализация поиска на Web-сайте

Реализуем поиск на нашем Web-сайте. Поиск будет осуществляться на основе информации, хранящейся в базе данных, которую мы создали в предыдущей лабораторной работе.

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

Скажем, для материала, рассказывающего о теге <AUDIO>, ключевыми словами будут "мультимедиа" и "аудио", поскольку он описывает способ размещения на Web-страницах аудиороликов, относящихся к мультимедийным материалам.

Далее, мы предоставим посетителю возможность выбирать критерии поиска: только по названиям, только по ключевым словам или и по названиям, и по ключевым словам. Для этого мы используем раскрывающийся список, т. к. он занимает немного места на Web-странице и вполне информативен.

Что касается самого поиска, то реализовать его несложно. Достаточно просмотреть все три массива, составляющие нашу базу данных, найти элементы, содержащие название или ключевое слово, совпадающее с введенным посетителем значением, и скопировать их в другой массив, который будет хранить результаты поиска. Потом на основе полученного массива мы сформируем, скажем, список, пункты которого будут представлять собой гиперссылки на соответствующие Web-страницы, и вставим его в контейнер cmain. Почти как в случае раздела "См. также".

Еще мы предусмотрим ситуацию, когда посетитель введет не все искомое название или ключевое слово, а только его начало. Соответственно, Web-сценарий, который мы напишем, будет искать элементы базы данных, начало названия или одного из ключевых слов которого совпадает с тем, что ввел посетитель.