JavaScript. Подробное руководство, 6-е издание

Флэнаган Дэвид

drag

dragover

dragend

dragleave

Эти события буксировки сопровождаются объектами событий, подобными тем, что передаются вместе с событиями от мыши. Отличаются они единственным дополнительным свойством

dataTransfer

, хранящим объект

DataTransfer

с информацией о передаваемых данных и о форматах, в которых эти данные доступны. Прикладной интерфейс механизма drag-and-drop, определяемый стандартом HTML5, описывается и демонстрируется в разделе 17.7.

Спецификация HTML5

определяет также механизм управления историей посещений (раздел 22.2), что позволяет веб-приложениям взаимодействовать с кнопками броузера Back (Назад) и Forward (Вперед). Этот механизм вводит события с именами «hashchange» и «popstate», которые возникают тогда же, когда и события «load» и «unload», и возбуждаются в объекте Window, а не в документе.

В HTML5 определяется множество новых особенностей HTML-форм. В дополнение к событиям ввода, описанным выше, спецификация HTML5 также определяет механизм проверки форм, который привносит событие «invalid», возбуждаемое в элементе формы, не прошедшем проверку. Однако производители броузеров, кроме Opera, не торопятся воплощать новые особенности форм и новые события, поэтому они не рассматриваются в этой книге.

Спецификация HTML5 включает поддержку веб-приложений, способных выполняться без подключения к сети (раздел 20.4), которые могут быть установлены локально в кэше приложений, чтобы их можно было запускать, даже когда броузер работает в автономном режиме (например, когда мобильное устройство находится вне сети). С этой поддержкой связаны два наиболее важных события, «offline» и «online»: они генерируются в объекте

Window

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

cached checking downloading error

noupdate obsolete progress updateready

Событие «message» используется множеством новых API веб-приложений для организации асинхронных взаимодействий. Прикладной интерфейс взаимодействий между документами (раздел 22.3) позволяет сценариям в документе с одного сервера обмениваться сообщениями со сценариями в документе с другого сервера. Это дает возможность безопасно обойти ограничения политики общего происхождения (раздел 13.6.2). При передаче каждого сообщения в объекте

Window

документа, принимающего сообщение, генерируется событие «message». Объект события, передаваемый обработчику, включает свойство

data

, хранящее содержимое сообщения, а также свойства

source

и

origin

, идентифицирующие отправителя сообщения. Событие «message» используется также для взаимодействия с фоновыми потоками Web Workers (раздел 22.4) и для сетевых взаимодействий посредством прикладных интерфейсов, определяемых спецификациями «Server-Sent Events» (раздел 18.3) и «WebSockets» (раздел 22.9).

Стандарт HTML5 и связанные с ним спецификации определяют некоторые события, генерируемые в объектах, не являющихся окнами, документами и элементами документов. Версия 2 спецификации «XMLHttpRequest», а также спецификация «File АРІ» определяют множество событий, помогающих следить за ходом выполнения асинхронных операций ввода/вывода. Эти события генерируются в объектах

XMLHttpRequest

или

FileReader

. Каждая операция чтения начинается с события «loadstart», за которым следует последовательность событий «progress» и событие «loadend». Кроме того, каждая операция завершается событием «load», «error» или «abort», генерируемым непосредственно перед заключительным событие^ «loadend». Подробнее об этих событиях рассказывается в разделах 18.1.4 и 22.6.5.

Наконец, стандарт HTML5 и связанные с ним спецификации определяют еще несколько различных типов событий. Спецификация «Web Storage АРІ» (раздел 20.1) определяет событие «storage» (генерируемое в объекте

Window

),

извещающее об изменении хранимых данных. В спецификации HTML5 также определены события «beforeprint» и «afterprint», впервые введенные компанией Microsoft в IE. Как следует из их имен, эти события генерируются в окне

Window

непосредственно до и после того, как документ будет напечатан, и предоставляют возможность добавить или удалить содержимое, такое как дата и время печати документа. (Эти события не должны использоваться для изменения представления документа для печати, потому что для этой цели в CSS уже имеются директивы определения типа носителя.)

17.1.4. События, генерируемые сенсорными экранами и мобильными устройствами

Широкое распространение мощных мобильных устройств, особенно устройств с сенсорными экранами, потребовало создания новых категорий событий. Во многих случаях события от сенсорных экранов отображаются на традиционные типы событий, такие как «click» и «scroll». Но не все виды взаимодействий с пользовательским интерфейсом через сенсорный экран можно имитировать с помощью мыши, и не все прикосновения к такому экрану можно интерпретировать, как события от мыши. В этом разделе кратко описываются жесты и события прикосновений, генерируемые броузером Safari, когда он выполняется на устройствах iPhone и iPad компании Apple, а также рассматривается событие «orientationchange», генерируемое, когда пользователь поворачивает устройство. На момент написания этих строк данные события не были стандартизованы, но консорциум W3C уже приступил к работе над спецификацией «Touch Events Specification», в которой за основу приняты события прикосновения, внедренные компанией Apple. Эти события не описываются в справочном разделе данной книги, но дополнительную информацию вы сможете найти на сайте Apple Developer Center .

Броузер Safari генерирует события для жестов масштабирования и вращения из двух пальцев. Событие «gesturestart» возбуждается, когда начинается выполнение жеста, а событие «gestureend» по его окончании. Между этими двумя событиями генерируется последовательность событий «gesturechange», позволяющих отслеживать выполнение жеста. Объект события, передаваемый вместе с этими событиями, имеет числовые свойства

scale

и

rotation

. Свойство

scale

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

scale

получает значение меньше 1.0, а для жеста, когда пальцы разводятся, свойство

scale

получает значение больше 1.0. Свойство

rotation

определяет угол поворота пальцев с момента события «gesturestart». Значение угла всегда является положительным и измеряется в градусах по часовой стрелке.

События жестов являются высокоуровневыми событиями, извещающими о жесте, уже прошедшем интерпретацию. Реализовать поддержку собственных жестов можно с помощью обработчиков низкоуровневых событий прикосновений. Когда палец касается экрана, генерируется событие «touchstart». Когда палец перемещается, генерируется событие «touchmove». А когда палец отнимается от экрана, генерируется событие «touchend». В отличие от событий мыши, события прикосновений не несут непосредственной информации о координатах прикосновения. Вместо этого в объекте события, который поставляется вместе с событием прикосновения, имеется свойство

changedTouches

. Это свойство хранит объект, подобный массиву, каждый элемент которого описывает позицию прикосновения.

Событие «orientationchanged» генерируется в объекте

Window

устройствами, позволяющими пользователям поворачивать экран для перехода из книжной ориентации в альбомную. Объект, передаваемый вместе с событием «orientationchanged», не очень полезен сам по себе. Однако в мобильной версии броузера Safari объект

Window

имеет свойство

orientation

, определяющее текущую ориентацию в виде числовых значений 0, 90, 180 или -90.