Какие события мыши мы должны
Какие события мыши мы должны использовать? Мы не имеем MouseDrag но мы можем достигать этого же самого через события MouseDown, MouseMove и MouseUp. JavaScript 1.2 использует новую модель событий. Без этой модели событий мы не могли бы решить нашу задачу. Я говорил относительно новой модели события в последнем уроке. Но давайте еще раз посмотрим на важные части.
Пользователь нажимает кнопку мыши где-нибудь внутри окна броузера. Наш сценарий должен реагировать на это событие и вычислять, какой объект (то есть уровень) был нажат. Мы должны знать координаты события мыши. JavaScript 1.2 применяет новый объект Event, который сохраняет координаты события мыши (помимо другой информации).
Другая важная вещь называется фиксацией события. Если пользователь например нажимает на кнопку, событие мыши посылается непосредственно объекту кнопки. Но в нашем случае мы хотим, чтобы окно обработало наше событие. Так что мы позволяем окну фиксировать событие мыши, то есть объект окна получает это событие и может воздействовать на него. Следующий пример показывает это (использование события Click). Вы можете нажать где-нибудь внутри окна броузера. Появится всплывающее окно, которое отобразит координаты события мыши:
Это код для приведенного выше примера:
<html>
<script language="JavaScript"> <!--
window.captureEvents(Event.CLICK);
window.onclick= displayCoords;
function displayCoords(e) { alert("x: " + e.pageX + " y: " + e.pageY); }
// --> </script>
Click somewhere inside the browser window.
</html>
Сначала мы сообщаем Window-объекту, зафиксировать событие Click. Для этого Мы используем метод captureEvent(). Следующая строка
window.onclick= displayCoords;
определяет, что должно произойти при событии Click. Она сообщает броузеру, что должно быть вызвана displayCoords(), как реакция на событие Click (Пожалуйста обратите внимание, что в этом случае Вы не должны использовать скобки после displayCoords). displayCoords()
- функция, которая, описывается наподобие этого
function displayCoords(e) { alert("x: " + e.pageX + " y: " + e.pageY); }
Вы можете видеть, что эта функция имеет один параметр (мы назовем его e). Это - объект Event, который передается функции displayCoords(). Объект Event имеет свойства pageX и pageY (помимо других), которые представляют координаты события мыши. Всплывающее окно отображает эти значения.