Java
Apply
Синтаксисapply(thisArg, argArray)
Параметры
thisArg ( вызываемый объект )
arg1, arg2, ... ( параметры вызываемого объекта )
apply позволяет применять методы одних объектов в контексте других ( вызывающих ). Так же как и в call объект this может принимать заданное значение ( this будет указывать на текущий, вызвавший объект ). Apply очень напоминает call, отличие лишь в типах параметров ( аргументов ) вызываемого объекта. В методе apply возможно использование любых типов массивов. Например: apply(this, new Array(name, value)). Разрешается так же использовать свойства вызываемого объекта. Можно использовать arguments для передачи всех параметров вызываемому обекту.
Пример:
function product(name, value) { this.name = name; if(value > 1000) this.value = 999; else this.value = value; } function prod_dept(name, value, dept) { this.dept = dept; product.apply(product, arguments); } prod_dept.prototype = new product(); cheese = new prod_dept(feta, 5, food); car = new prod_dept(honda, 5000, auto);
Архитектура сервлета
Разобьем нашу программу на две части. Первая часть - сервлет - отвечает за обработку HTTP запроса и возвращает клиенту требуемое изображение, если это возможно. Вторая часть, класс, формирующий картинку. Для простоты реализации, в качестве параметра при обращении к сервлету будет передаваться имя используемого класса. Соответствующий Java класс должен реализовывать определенный интерфейс для общения с сервлетом. Приведем описание этого интерфейса:public interface ImageProducer {
/** * MIME тип создаваемого изображения. * * @return MIME тип изображения. */ public String getMIMEType();
/** * Создает изображение и записывает его в указанный поток. * * @param stream Куда писать картинку. */ public void createImage(OutputStream stream) throws IOException; }
Интерфейс ImageProducer содержит метод для определения типа изображения и метод для формирования изображения. Полученная картинка отправляется клиенту.
Следующий код демонстрирует, как сервлет работает с классами, реализующими интерфейс ImageProducer:
ImageProducer imageProducer =
(ImageProducer) Class.forName(request.getQueryString()).newInstance(); response.setContentType(imageProducer.getMIMEType()); imageProducer.createImage(response.getOutputStream());
Сервлет создает (загружается) класс с именем, указанным в параметрах запроса - части URL справа после "?". Полученный класс приводится к типу ImageProducer. Затем, обращаясь к соответствующим методам, сервлет получает тип и формирует изображение. В случае если нет ошибок, картинка пересылается клиенту.
Приведенный код может вызвать несколько исключений, наиболее распространенные из них: ClassNotFoundException и ClassCastException. Первое вызвано тем, что класс, имя которого передано в качестве параметра запроса, не доступен загрузчику (ClassLoader), второе же тем, что указанный класс не реализует интерфейс ImageProducer. В случае ошибки клиент, конечно же, не получает картинку, и броузер выводит изображение, показывающее, что сервер не ответил на запрос. Программа тестировалась с использованием Java Server Web Development Kit (JSWDK 1.0.1), но вы должны получить аналогичные результаты на большинстве других Веб серверах, поддерживающих Java.
Бегущая строка
Бегущая строка в строке статусаБегущая строка в поле form.
Brows
| Имя броузера | document.write(navigator.appName); |
| Версия броузера | document.write(navigator.appVersion); |
| Кодовое название броузера | document.write(navigator.appCodeName); |
| Заголовок пользовательского агента | document.write(navigator.userAgent); |
Call
Синтаксисcall(thisArg, arg1, arg2, ...)
Параметры
thisArg ( вызываемый объект )
arg1, arg2, ... ( параметры вызываемого объекта )
call позволяет вызывать методы одних объектов в контексте других ( вызвавших ) объектов. Это дает возможность задать свое значение объекту this, при вызове функции и, что самое главное, метод call позволяет написать метод один раз и наследовать его для других объектов не переписывая их! (См. также apply ).
Пример:
function product(name, value) { this.name = name; if(value > 1000) this.value = 999; else this.value = value; } function prod_dept(name, value, dept) { this.dept = dept; product.call(this, name, value); } prod_dept.prototype = new product(); cheese = new prod_dept(feta, 5, food); car = new prod_dept(honda, 5000, auto);
Чтение и запись изображений, требования к JDK
Для того чтобы сервлет - приложение, выполняемое на сервере, которое обрабатывает запросы пользователей,- мог динамически создавать изображения, прежде всего, необходим механизм чтения и записи графических файлов. Точнее, сервлет должен уметь отправить полученную картинку в ответ на запрос пользователя. Основные библиотеки (Core API) для Java не предоставляют средств, используя которые можно было бы сохранить полученное в памяти изображение в одном из графических форматов. Есть библиотеки Sun для Java 1.1 и лицензированные Sun библиотеки для Java 1.2. Поскольку, они расположены в пакете com.sun они не относятся ни к основным библиотекам, ни к стандартным расширениям (standard extension), поэтому использующие их приложения нельзя считать переносимыми (portable). Другими словами, они могут и не работать на виртуальной машине, выпущенной другой компанией. Стоит отметить, что утвержденный запрос Java Specification Request JSR-000015 на стандартное расширение Java 2 содержит описание механизма для чтения и записи графических файлов; когда он будет реализован, можно будет писать переносимые программы, осуществляющие ввод/вывод изображений.Для этой статьи я подготовил примеры, работающие на платформах Java 1.1 и Java 1.2.
Что нового в JavaScript версии 1.3 от Netscape.
Степанищев ЕвгенийЯзык JavaScript 1.3 поддерживается Navigator'ом версий 4.06 и 4.5.
Динамическая графика в Java сервлетах
Кен МакКрэри,Server-Side Java
Обзор
Как создать графический счетчик посещений? Диаграмму, изображающую загруженность канала до провайдера или количество писем в очереди? Одним словом, как сформировать изображение динамически по запросу пользователя? В своей статье Ken McCrary предлагает варианты решения этой задачи. (2500 слов)
Графики и диаграммы позволяют облегчить восприятие аналитической информации. Представьте, например, таблицу измерений параметров загруженности канала, проводимых каждые пять минут. Трудно поверить, что у вас хватит терпения просматривать ее хотя бы раз в неделю. Тогда как, соответствующая диаграмма представляется вполне удобоваримой и исчерпывающей. Во многих случаях изображения должны создаваться в реальном времени по запросу пользователя. Потребность в этом может быть обусловлена природой отображаемых данных, в случае, когда данные поступают непрерывно или меняются со временем, или же возможностью значительно уменьшить используемое дисковое пространство. Конечно же, не всегда уместно (технически осуществимо) конструировать изображения динамически, но, там, где это действительно необходимо, использование удачных технологических решений может привести к значительному выигрышу в производительности и качестве сервиса.
Ex_date.shtml
Для вывода текущей даты используется объект Date и метод write объекта document.current_date = new Date();
document.write("
Текуща\я дата: " + current_date + ".
");
Также можно вывести сокращенный вариант для этого используются методы getDate, getMonth, getYear. Обратите внимание, что нумерация месяцев начинается с нуля.
current_date = new Date();
document.write("
Число: " + current_date.getDate() + "." + current_date.getMonth() + "." + current_date.getYear() + ".
");
Или такой вариант:
current_date = new Date();
document.write("
Врем\я: " + current_date.getHours() + "." + current_date.getMinutes() + "." + current_date.getSeconds() + ".
");
Exdiag.shtml
Гистограмма построена с использованием свойства images[ ] объекта Document.1.
2.
Java
Многие связывают неправильный вывод русских букв с неправильной установкой шрифта. Мне кажется, это связанно с тяжким опытом программирования на Windows 3.x, где основная причина действительно была в этом. В Java всё сложнее и редко действительно связанно со шрифтами. Я не разбирался со специфическими настройками броузеров, т.к. ещё не писал апплетов, только приложения, но думаю в последних версиях в этом плане всё нормально.Где же действительно лежат наибольшие подводные камни? В основном это связанно с неправильной перекодировкой символов. Часть этих проблем и методы их решения описаны выше. Если у Вас все преобразования выполняются корректно, и для вывода используется шрифт Unicode, то есть очень большой шанс, что Ваша программа будет работать правильно.
Если проблемы всё же остались, тут нужно выяснить, где они возникают. Попробуйте запустить приложение под разными JVM, под разными платформами, на разных броузерах.
Если программа не работает нигде - значит проблема только в ней и в ваших руках. Внимательно перечитайте всё, что было написано выше, и ищите. Если же проблема проявляется только в конкретном окружении - значит дело, скорей всего в настройках. Где именно - зависит от того, какой графической библиотекой Вы пользуетесь. Если AWT - помочь может правильная настройка файла font.properties.ru. Пример корректного файла можно взять из Java 2. Если у Вас нет этой версии, можете скачать его с данного сайта: , . Если у Вас установлена русская версия OS - просто добавьте этот файл туда, где лежит файл font.properties. Если же это англицкая версия, то нужно, или дополнительно сменить текущий язык при помощи задания настройки -Duser.language=ru или переписать этот файл вместо font.properties. Этот файл задаёт используемые шрифты и кодовые страницы.
С библиотекой Swing всё проще - в ней всё рисуется через подсистему Java2D. Надписи в стандартных диалогах (JOptionPane, JFileChooser, JColorChooser) переделать на русский очень просто - достаточно лишь создать несколько файлов ресурсов. Я это уже проделал, так что можете просто взять готовый и добавить его в свой CLASSPATH. Единственная проблема, с которой я столкнулся - в версиях JDK начиная с 1.2 rc1 и по 1.3 beta, русские буквы не выводятся под Win9x при использовании стандартных шрифтов (Arial, Courier New, Times New Roman, etc.) из-за ошибки в Java2D. Ошибка весьма своеобразна - со стандартными шрифтами изображения букв отображаются не в соответствии с кодами Unicode, а по таблице Cp1251 (кодировка Ansi). Эта ошибка зарегистрирована в BugParade под номером . По умолчанию в Swing используются шрифты, задаваемые в файле font.properties.ru, так что достаточно заменить их другими - и русские буквы появляются. К сожалению, набор рабочих шрифтов небольшой - это шрифты Tahoma, Tahoma Bold и два набора шрифтов из дистрибутива JDK - Lucida Sans * и Lucida Typewriter * (). Чем эти шрифты отличаются от стандартных - мне непонятно.
Начиная с версии 1.3rc1 эта проблема уже исправлена, так что можно просто обновить JDK. Так же надо учесть, что с оригинальной версией Win95 поставляются шрифты, не поддерживающие Unicode - в этой ситуации можно просто скопировать шрифты из Win98 или WinNT.
Если же вам, кровь из носу, нужно использовать стандартные шрифты, работая в JDK 1.2, то можно компенсировать этот глюк, перекодировав строки текста непосредственно перед выводом. Сделать это можно, например, так:
public static String convertToWin9x(String s) { byte[] bb; try { bb = s.getBytes("Cp1251"); } catch( java.io.UnsupportedEncodingException e ) { return s; } char[] cb = new char[bb.length]; for(int i=0; i < bb.length; i++) { cb[i] = (char)( bb[i] & 0x00FF ); } return new String(cb); }
Но только не забудьте - этот код будет работать только под Win9x и Sun JDK/JRE 1.2.
По поводу компилятора jikes. Как мне рассказали в конференции по Java (fido7.ru.java) при использовании этого компилятора русские буквы тоже появляются. Это на самом деле классический пример того, как один глюк компенсирует другой - jikes просто не учитывает кодировку исходников. Того же эффекта можно добиться, если указать javac кодировку ISO-8859-1 (Latin1) в ключике -encoding. Если при этом в исходниках русские символы записаны в кодировке Cp1251, то тем самым они вместо диапазона 0x400-0x4ff (стандартный диапазон Unicode для кириллицы) попадают в диапазон 0x80-0xff. Из-за вышеупомянутого глюка в среде Win9x кириллица в стандартных шрифтах отображается как раз в этом диапазоне и русские буквы появляются. Если же попробовать запустить программу в другой среде (например, в WinNT) - русских букв не будет, так как там этот глюк отсутствует.
Аналогично на подобную компенсацию можно нарваться, если поменять региональные настройки с русских на буржуйские. При этом, кроме всего прочего, меняется и кодировка по умолчанию (file.encoding) - вместо 1251 становится 1252. Это приводит к тому, что, если при чтении файлов кодировка не была явно указана (и при компиляции не задавался ключик -encoding), то русские буквы переезжают в диапазон 0x80-0xff и создаётся впечатление нормальной работы. Разницу можно заметить на преобразованиях регистра и сортировках через java.text.Collator - они будут выполняться неверно. А если были использованы строковые константы - то на других платформах вы увидите только кракозяблы.
Ещё один способ - скачать версию Swing для JDK 1.1 и запускать приложение из под Microsoft JVM - там всё выводится корректно. Только не забудьте обновить MS JVM - те версии, что идут в комплекте с IE 4.x не совсем корректно работают. С сервера Microsoft можно скачать свежую версию, например 5.00.3240 - с ней всё ОК.
Кстати, по поводу MS JVM. Непонятно по каким соображениям, но в ней отсутствуют все файлы кодировок русских букв, акромя Cp1251 (наверное, они таким образом пытались уменьшить размер дистрибутива). Если Вам нужны другие кодировки, например, Cp866, то нужно добавить соответствующие классы в CLASSPATH. Причём классы от последних версий Sun JDK не подходят - у Sun-а уже давно изменилась их структура, поэтому последние версии классов с Microsoft-ом не стыкуются (у MS осталась структура от JDK 1.1.4). На сервере Microsoft, в принципе, лежит полный комплект дополнительных кодировок (страница , ссылка "Additional I/O libraries"), но там файл размером около 3 метров, а их сервер докачку не поддерживает :-). Мне удалось таки выкачать этот файл, я его перепаковал jar-ом, можете взять его .
I18n (вывод чисел, дат и т.п.)
Загадочная комбинация i18n расшифровывается просто - это сокращение от могучего слова Internationalization. 18 - это кол-во букв между i и n. Означает оно, в контексте Java, возможность автоматической подстройки программы под текущий язык и специфику страны. Делается это через использование класса Locale, представляющего язык и конкретную страну, и классов, которые знают, что с этим Locale делать. Большинство этих классов находятся в пакете java.text.Основной класс, которым пользуются все остальные, - это java.util.ResourceBundle, который позволяет загружать различные виды ресурсов. Причём имя загружаемого класса или файла properties зависит от указанного Locale (или Locale по умолчанию - если ничего не указанно).
Имя искомого файла формируется при помощи добавления идентификатора языка и страны к имени ресурса. Например, если грузится ресурс resfile, а текущий Locale - ru_RU, то поиск его будет идти в следующем порядке:
Это позволяет легко добавлять описания для новых языков и стран. Большинство классов сами заботятся обо всей этой внутренней кухне, так что Вам об этом знать часто и не нужно.
Что касается дат, то само форматирование выполняется классом DateFormat. Получить формат, уже настроенный на язык и страну можно при помощи методов getDateInstance(), getTimeInstance() и getDateTimeInstance(). В качестве аргумента можно указать одну из констант для задания необходимого стиля формата. По умолчанию будет использован предпочтительный стиль для данного Locale. Допустимые константы:
| Константа | Описание | Пример |
| SHORT | Полностью цифровой, короткий вывод | 25.01.99 или 17:40 |
| MEDIUM | Вывод средней длины | 25.01.1999 |
| LONG | Длинный вывод | 25 Январь 1999 г. или 17:23:32 |
| FULL | Вся информация Понедельник, | 25 января 1999 г. или 17:23:32 GMT+03:00 |
Пример:
// Вывод пользователю текущей даты DateFormat df = DateFormat.getDateInstance(); String s = df.format(new Date()); ... // Вывод текущего времени без секунд DateFormat df = DateFormat.getTimeInstance(DateFormat.SHORT); String s = df.format(new Date());
Если же вы хотите сами контролировать набор выводимых полей и их разделители, то для этого можно использовать класс SimpleDateFormat.
Аналогичным образом делается и форматирование чисел. За это отвечает класс NumberFormat. Получить форматы можно при помощи методов getInstance(), getNumberInstance(), getCurrencyInstance() и getPercentInstance(). Свой формат можно сконструировать при помощи класса DecimalFormat.
Идущие часики
Идущие часики можно поместить в строке статуса и в поле form. (Реализация объекта Date в Netscape Navigator 2.0 содержит ошибки)Первый пример - скрипта, создающего часики в строке статуса при загрузке документа:
Второй пример - скрипта, создающего часики (в сокращенном варианте) в поле form
Третий пример - еще один вариант отображения часиков. Причем обратите внимание, что функция вызывается в теле документа, а не в HTML-теге как в предыдущем примере.
В четвертом примере часики с "P.M." и "A.M."
Infinity
СинтаксисInfinity
Числовое значение величины Infinity - бесконечность. В JavaScript 1.2 Infinity было определено как свойство объекта Number. У объекта Number есть два свойства POSITIVE_INFINITY и NEGATIVE_INFINITY ( для примера, Number.POSITIVE_INFINITY ). В JavaScript 1.3 Infinity определено и для объекта Global. Значение Infinity ( положительная бесконечность ) всегда больше, чем любое другое число, включая себя. Infinity полностью соответствует математической бесконечности. Например любое число, умноженное на Infinity, есть Infinity, любое число, деленное на Infinity, есть 0.
Информация о броузере.
Существуют броузеры, не поддерживающие некоторых возможностей JavaScript. Поэтому, чтобы не возникало ситуаций, когда броузер пользователя не видит чего-либо в вашем документе, можно использовать свойства объекта Navigator: appName и appVersion, которые определяют имя и версию броузера. В зависимости от версии броузера можно осуществлять вызов того или иного документа.Например, на платформах с 16-разрядной Windows обращение к функции eval() приводит к краху Netscape Navigator 2.0. Поэтому, если мы посмотрим , где используется эта функция, то в нем как раз анализируется имя и версия броузера.
| Пример: |
| Имя броузера | |
| Версия броузера | |
| Кодовое название броузера | |
| Заголовок пользовательского агента |
Информация о дате последнего изменения документа.
Для этого в HTML-теге используется свойство lastModified объекта Document. В данном примере такая информация выводится в строку статуса.Информация о документе.
Такая информация может быть помещена в строке статуса при загрузке документа. Для этого в HTML-тэг добавлен атрибут onLoad="status='Примеры скриптов. Центр Информационных Технологий'"Также при попадании указателя мыши в область ссылки вместо имени файла, появляющегося в строке статуса, можно поместить информацию об этом документе.
Обратите внимание, что при загрузке документа в строке статуса одна информация, при попадании указателя мыши в область ссылки - другая, а после выхода указателя мыши из области ссылки - третья. Для этого в HTML-теге добавлены обработчики событий onMouseOver и onMouseOut и свойство status объекта Window:
onMouseOver="status='Примеры скриптов' ;return true"
onMouseOut="status='Центр Информационных Технологий' ;return true"
Информацию также можно выводить в диалоговое окно, при этом выполнение программы не прерывается. Для этого используется метод alert() объекта Window и обработчик событий onMouseOver, включенные в HTML-тег . В окне есть кнопка "OK", которая закрывает диалоговое окно.
Например, при попадании указателя мыши в область ссылки открывается диалоговое окно с каким-либо сообщением (лучше, если оно будет не на русском языке).
onMouseOver="alert('Server for Information Technologies')"
IsFinite
СинтаксисIsFinite(число)
Вы можете использовать эту функцию, для определения конечности числа. Если аргумент функции NaN положительная или отрицательная бесконечность, функция возвращает false, иначе она возвращает true.
Пример:
Проверка числа на конечность
if(isFinite(Input) == true) { // Ваш код }
История посещений.
Использование объекта History предоставляет возможность возвращаться на URL, который был посещен перед этим (что эквивалентно щелчку на кнопке BACK), и переходить на URL, посещенный перед этим (что эквивалентно щелчку на кнопке FORWARD). Список посещенных URL содержится в меню GO броузера Netscape Navigator.Делается это, используя методы объекта History: back() и forward(). Для этого в HTML-тег включается следующая строка:
или
Если необходимо вернуться на несколько позиций списка меню GO, то используется метод go(), в скобках указывается целочисленный аргумент (отрицательное значение которого соответствует количеству шагов НАЗАД, положительное -ВПЕРЕД). Например, для возврата на три позиции назад указывается go(-3), вперед - go(3).
Обратите внимание: если нет посещенных перед этим URL, то это не будет работать.
Изменение фона документа.
Изменение фона документа при выборе кнопки с названием цвета. При этом используется свойство bgColor объекта Document.Свойство bgColor в Netscape Navigator 2.0 содержит ошибки.Документ с изменяющимся фоном.
Изменение картинки
В данном примере для этого используется свойство images[ ] объекта Document.
В предыдущем примере изменение происходило при попадании курсора мыши в область картинки и при выходе курсора из нее. В данном примере это организовано в цикле для двух картинок с использованием метода setTimeout.
Работает только в Netscape Navigator 3.0 и выше!

Данный пример аналогичен предыдущему, но сам скрипт написан несколько иначе.

Этот пример иллюстрирует возможность изменения картинки при выборе из списка.
![]() |
|---|
Изменение картинки при выборе гиперссылки.
|
Изменение картинки при загрузке документа в зависимости от текущего времени осуществляется с использованием объекта Date.
Работает во всех броузерах, поддерживающих JavaScript.
Изменения в методах объекта Date
Методы объекта Date в версии 1.3 получили дополнительные параметры:setMonth(month[, date]) setHours(hours[, min[, sec[, ms]]]) setMinutes(min[, sec[, ms]]) setSeconds(sec[, ms])
Теперь эти методы по своей форме полностью эквивалентны методам setUTC*.
Изменения в объекте Array
Свойство lengthДлина массива ( свойство length ) теперь задается беззнаковым 32-битным целым. Значение свойства length может лежать в пределах от 0 до 232-1.
Конструктор
В JavaScript 1.3 при использовании конструктора с единичным параметром ( new Array(len) ) конструктор проверяет тип параметра. Если это число конструктор конвертирует его в 32-битное беззнаковое целое и создает массив со свойством length ( размер массива ), установленное в integer. Начальные значения элементов массива - undifined.
Метод push
В JavaScript 1.2 метод push возвращал последний элемент, добавленный к массиву. В версии 1.3 метод возвращает новую длину массива.
Метод splice
В JavaScript 1.2 метод splice возвращал удаленный элемент, если удалялся только один элемент ( параметр howMany равен 1 ). В JavaScript 1.3 splice всегда возвращает массив, содержащий удаленные элементы. Если удаляется только один элемент, то splice вернет массив, содержащий один единственный элемент.
Изменения в операторах == и !=
Если операнды разного типа просходит преобразование. Как результат возвращается значение типа Boolean. Если типы операндов одинаковы, то операторы == и != эквивалентны === и !==. Значения null и undifined считаются одинаковыми, NaN считается не равным ни одному значению, включая NaN.Пример:
10=='10'
возвращает true
Java/JavaScript
Илья Кантор, javascript.ru
, ведущий программист Red Graphic Systems
Вячеслав Шуранов,
Вячеслав Шуранов,
Олег Никитенко,
Владимир Дригалкин,
Наталия Елманова
Статья была опубликована в журнале КомпьютерПресс 8'2003 и на сайте компании Interface
, 23.07.2003
Дмитрий Брязгин,
Тотоев Александр, Корхова Ольга
Евгений Игумнов, Геокад Плюс (Новосибирск)
Сергей Посохов, 24.11.1999,
Кен МакКрэри, перевод: ,
,
Сергей Астахов,
С. Б. Дунаев
Степанищев Евгений, Web-программист казанского центра интернет
Степанищев Евгений, Web-программист казанского центра интернет
Павел Храмцов, Центр Информационных Технологий
Валерий Коржов, журнал #02/97
© 1996, 1997 Стефан Кох (Stefan Koch)
Перевод на русский язык с разрешения Стефана Коха -
Наталия Бельтикова, Ирина Кузина (РНЦ "Курчатовский институт")
Наталия Бельтикова, Ирина Кузина (РНЦ "Курчатовский институт")
Наталия Бельтикова, Ирина Кузина (РНЦ "Курчатовский институт")
Наталия Бельтикова, РНЦ "Курчатовский институт"
Павел Храмцов, статья из ComputerWorld
Павел Храмцов, статья из ComputerWorld
Павел Храмцов, Центр Информационных Технологий, ComputerWorld #6/96
Материалы конференции,
Материалы конференции,
Java: Русские буквы и не только...
Сергей Астахов (),Здесь я попытался собрать информацию по поводу написания русскоязычных программ на языке Java. Если Вам известно что-либо помимо того, что я тут понаписал, напишите мне, ваши добавления будут кстати.
Не забудьте закрыть
Как заставить AJAX читать между строк
, ведущий программист Red Graphic SystemsНа страницах вашего сайта содержится множество специализированных терминов. Когда пользователь просматривает сайт, у него могут возникать вопросы касательно этих терминов. Как сделать так, чтобы посетитель сайта по мере возникновения вопросов мог незамедлительно получать на них ответы? Раньше термины на страницах сайта оформлялись как ссылки и пользователь при желании мог кликать по ним и получать окно с контекстной подсказкой. Это подход достаточно неуклюжий, он отнимает у пользователя слишком много времени - на то, чтобы кликнуть по ссылке, дождаться загрузки окна и затем закрыть окно. В эпоху AJAX мы можем быть ближе к пожеланиям пользователей. Мы можем сделать так, чтобы уже при наведении мыши на термин незамедлительно появлялось сообщение с подсказкой и как только курсор мыши сдвинут с термина, сообщение исчезало. Наличие этого сервиса не отразится на объеме страниц сайта. При запросе контекстной подсказки Java Script будет обращаться к внешнему словарю, получать содержание и отображать его.
Метод получения информации по неявному запросу может найти применение не только в словаре терминов. Обращали ли вы внимание на ссылки с двойным подчеркиванием в таких проектах как hotscripts.com и devarticles.com? Это контекстная реклама на основе движка IntelliTXT компании Vibrant Media. При наведении курсора мыши на подобную ссылку появляется окно с рекламным предложением на соответствующую тему. Эта технология уже получила название in-text advertising.
Все чаще и чаще подобный метод применяется и на новостных порталах. Посетители видят на главной странице портала лишь заголовки новостей. Однако при наведении курсора мыши на заголовок новости они получают ее краткое описание. Таким образом, на главной странице портала можно вместить куда как больше новостей. Посетитель портала увидит заголовки и для того, чтобы получить анонсы новостей, ему будет достаточно пробежаться курсором мыши по заголовкам.
Давайте теперь рассмотрим, каким образом реализуется контекстная подсказка с помощью AJAX. Программисту, освоившему этот метод, не составит труда заставить портал комментировать новости по запросу или же написать модуль in-text advertising.
Итак, очевидно нам следует позаботиться об окне сообщения, того самого, которое будет появляться каждый раз, когда посетитель наводит курсор на термин. Для того, чтобы окно появлялось и исчезало мгновенно, следует поместить его на скрытом DIV.
Для простоты эксперимента мы можем оформить его в стиле системных сообщений MS Windows.
Окно должно появиться в тот момент, когда посетитель навел курсор мыши на термин и исчезнуть, когда курсор мыши будет за пределами термина. Причем, в тот самый момент окно должно содержать уже не пробел, а текст определения термина. Таким образом, мы должны поместить термины в тексте документа в inline тег, поддерживающий события onMouseOver и onMouseOut. Первому событию следует назначить функцию JavaScript, которая получит определение термина, поместит его в окно сообщения и покажет окно. Второму событию требуется назначить функцию, которая просто скроет окно сообщения.
onmouseout="hideMessage();">термин
В параметре функции, отображающей окно (getDefenition) сообщения надо указать термин. Этот термин будет использован для запроса текста определения посредством AJAX. Так как при показе окна нам потребуется его позиционировать под курсором мыши для поддержки Gecko-базированых браузеров, в эту функцию также следует передать параметр event. Функция для сокрытия окна (hideMessage) не требует каких-либо параметров.
Теперь наша задача - при вызове функции getDefinition заставить JavaScript позиционировать окно сообщения.
function adjustMessage(evt) { MessageObj = document.getElementById('InstantMessage'); if (isThisMozilla) event=evt;
var rightedge = document.body.clientWidth-event.clientX; var bottomedge = document.body.clientHeight-event.clientY; if (rightedge < MessageObj.offsetWidth) MessageObj.style.left = document.body.scrollLeft + event.clientX - MessageObj.offsetWidth; else MessageObj.style.left = document.body.scrollLeft + event.clientX; if (bottomedge < MessageObj.offsetHeight) MessageObj.style.top = document.body.scrollTop + event.clientY - MessageObj.offsetHeight; else MessageObj.style.top = document.body.scrollTop + event.clientY;
MessageObj.innerHTML = 'Loading...'; MessageObj.style.visibility = "visible"; }
Итак, мы имеем окно сообщения, рапортующее о загрузке данных. Теперь следует выполнить запрос к контроллеру за определением термина. Вы можете написать собственные функции для обслуживания AJAX запросов. Но если вы только начинаете работать с AJAX, я могу порекомендовать вам готовую библиотеку от Yahoo. В этом случае запрос будет выглядеть так:
function getDefinition(term,evt){ adjustMessage(evt); var request = YAHOO.util.Connect.asyncRequest('POST',
'http://адрес_контроллера', callback, 'term='+term); }
Раз мы запрашиваем контроллер, очевидно, нам надлежит его написать. В общем случае, это самая простая часть. Задача контроллера - вернуть описание термина, переданного в POST. Каким бы языком программирования мы не пользовались при написании контроллера, нам достаточно выполнить несколько простейших операций.
{ "errormsg" : "в случае ошибки ее код", "content" : "текст определения" }
Это структура данных, известная как JSON. Она воспринимается JavaScript в явном виде, как "родная". В случае использования AJAX-библиотеки YAHOO ответ контроллера обслуживается следующей конструкцией
var handleSuccess = function(o){ if(o.responseText !== undefined){ showMessage(o.responseText); } };
var handleFailure = function(o){ if(o.responseText !== undefined){ showMessage("Connection Error"); } };
var callback = { success:handleSuccess, failure:handleFailure, argument:['foo','bar'] };
Нам осталось лишь описать функцию showMessage(), которая помещает принятый текст определения в окно сообщения
function showMessage(json) { var respondStructure = eval( '(' + json + ')' ); MessageObj.innerHTML = respondStructure.content; return false; }
Как вы понимаете, для сокрытия окна сообщения потребуется лишь изменить атрибут объекта
function hideMessage(){ var MessageObj=document.getElementById('InstantMessage'); MessageObj.style.visibility="hidden"; }
Когда вы будете опробовать этот пример, едва ли вы встретитесь с проблемами под браузером MS IE, однако, в FireFox вы можете обнаружить мерцание окна сообщения. Это связано с тем, что FireFox своеобразно обслуживает события onMouseOver/onMouseOut. Впрочем, эту проблему можно решить путем расстановки флагов задержки в функциях обслуживания этих событий.
Скрипты приведенного здесь примера можно загрузить здесь
Работу примера можно увидеть здесь
Информация об авторе.
Дмитрий Шейко
www.cmsdevelopment.com
Ведущий программист
Занят разработкой программного обеспечения с 1987 года. Начиная с 1998 года опубликовал более 50 технических статей в специализированных изданиях. С 2001 года разрабатывает архитектурные решения и инструментальные средства для управления содержанием (Content Management, CMF, ECM). В 2004 году разработал и опубликовал спецификацию универсального языка для разработчиков CMS XML Sapiens
Литература
Массив anchors
Вы можете ссылаться на объекты anchor в вашей программе, используя массив anchors. Этот массив содержит запись для каждого тага , содержащего атрибут NAME по порядку встречаемости в документе. Например, если документ содержит три поименованных якоря, то эти якоря представлены как document.anchor[0], document.anchor[1], document.anchor[2].Использование массива anchors:
index целое число, представляющее якорь в документе.
Для получения количества якорей в документе используется свойство length: document.anchors.length.
Хотя массив anchors представляет собой поименованные якоря, значение anchors[index] является всегда нулевым. Но если в документе якоря именуются по порядку натуральными числами, вы можете использовать массив anchors и его свойство length для употребления имени якоря перед использованием его в операторах, таких как установка location.hash.
Элементы массива anchors окрыты открыты только для чтения. Например, выражение document.anchors[0]="anchor1" не имеет эффекта.
