MouseEvent

Интерфейс MouseEvent представляет собой событие, которое происходит в результате взаимодействия пользователя с манипулятором ( например, мышью). Наиболее частые из таких событий: click (en-US), dblclick (en-US), mouseup (en-US), mousedown (en-US).

MouseEvent выводится из метода UIEvent (en-US), который в свою очередь происходит из метода Event. Метод MouseEvent.initMouseEvent() (en-US) допустимо использовать для лучшей совместимости с предыдущими версиями, однако, для создания MouseEvent рекомендуется использовать конструктор метода MouseEvent() (en-US).

Несколько более конкретные события, производные от события mouseevent: WheelEvent (en-US) and DragEvent (en-US).

Конструктор

MouseEvent() (en-US): Создаёт объект MouseEvent.

Свойства

Данный интерфейс наследует свойства от родителей UIEvent (en-US) и Event.

MouseEvent.altKey (en-US) Только для чтения

Возвращает значение true, если клавиша

alt

была нажата во время движения мыши.

MouseEvent.button Только для чтения

Представляет код клавиши, нажатой в то время, когда произошло событие мыши.

MouseEvent.buttons Только для чтения

Отображает, какие клавиши были нажаты во время движения мыши.

MouseEvent.clientX Только для чтения

Отображение X координат курсора мыши в локальной системе координат (DOM контент).

MouseEvent.clientY Только для чтения

Отображение Y координат курсора мыши в локальной системе координат (DOM контент).

MouseEvent.ctrlKey Только для чтения

Возвращает значение true, если клавиша

control

была нажата во время движения мыши.

MouseEvent.metaKey (en-US) Только для чтения

Возвращает значение true, если клавиша

meta

была нажата во время движения мыши.

MouseEvent.movementX (en-US) Только для чтения

Отображает X координат указателя мыши относительно позиции последнего mousemove (en-US) события.

MouseEvent.movementY (en-US) Только для чтения

Отображает Y координат указателя мыши относительно позиции последнего mousemove (en-US) события.

MouseEvent.offsetX Только для чтения Экспериментальная возможность

Отображает X координат указателя мыши относительно позиции границы отступа целевого узла.

MouseEvent.offsetY (en-US) Только для чтения Экспериментальная возможность

Отображает Y координат указателя мыши относительно позиции границы отступа целевого узла.

MouseEvent.pageX Только для чтения Экспериментальная возможность

Отображает X координат указателя мыши относительно всего документа.

MouseEvent.pageY (en-US) Только для чтения Экспериментальная возможность

Отображает Y координат указателя мыши относительно всего документа.

MouseEvent.region (en-US) Только для чтения

Возвращает id затронутого событием региона. Если ни какой регион затронут не был, возвращает null.

MouseEvent.relatedTarget (en-US) Только для чтения

Второстепенная цель события, если таковая есть.

MouseEvent.screenX Только для чтения

Отображает X координат указателя мыши в пространстве экрана.

MouseEvent.screenY (en-US) Только для чтения

Отображает Y координат указателя мыши в пространстве экрана.

MouseEvent.shiftKey Только для чтения

Возвращает true если клавиша

shift

была нажата, когда произошло событие мыши.

MouseEvent.which (en-US) Non-standard Только для чтения

Возвращает код последней нажатой клавиши, когда произошло событие мыши.

MouseEvent.mozPressure Non-standard Только для чтения

Отображает давление которое было осуществлено при нажатии. Значение будет между 0.0 (минимальное давление) и 1.0 (максимальное давление).

MouseEvent.mozInputSource (en-US) Non-standard Только для чтения

The type of device that generated the event (one of the MOZ_SOURCE_* constants listed below). This lets you, for example, determine whether a mouse event was generated by an actual mouse or by a touch event (which might affect the degree of accuracy with which you interpret the coordinates associated with the event).

MouseEvent.webkitForce (en-US) Non-standard Только для чтения

Отображает количество приложенного давления при клике.

MouseEvent.x (en-US) Экспериментальная возможность Только для чтения

Alias для MouseEvent.clientX.

MouseEvent.y (en-US) Экспериментальная возможность Только для чтения

Alias для MouseEvent.clientY

Константы

MouseEvent.WEBKIT_FORCE_AT_MOUSE_DOWN (en-US) Non-standard Только для чтения: Минимальная необходимая сила для обычного клика
MouseEvent.WEBKIT_FORCE_AT_FORCE_MOUSE_DOWN (en-US) Non-standard Только для чтения: Минимальная необходимая сила для усиленного клика

Методы

Данный интерфейс наследует свойства от родителей, UIEvent (en-US) and Event.

MouseEvent.getModifierState() (en-US): Returns the current state of the specified modifier key. See the KeyboardEvent.getModifierState (en-US)() for details.
MouseEvent.initMouseEvent() (en-US) Устарело: Initializes the value of a MouseEvent created. If the event has already being dispatched, this method does nothing.

Пример

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

function simulateClick() {
  var evt = new MouseEvent("click", {
    bubbles: true,
    cancelable: true,
    view: window,
  });
  var cb = document.getElementById("checkbox"); //element to click on
  var canceled = !cb.dispatchEvent(evt);
  if (canceled) {
    // A handler called preventDefault
    alert("canceled");
  } else {
    // None of the handlers called preventDefault
    alert("not canceled");
  }
}
document.getElementById("button").addEventListener("click", simulateClick);

html

<p>
  <label><input type="checkbox" id="checkbox" /> Checked</label>
</p>
<p><button id="button">Click me</button></p>

Нажмите на кнопку, чтобы посмотреть, как работает пример.

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

Specification
UI Events # interface-mouseevent
CSSOM View Module # extensions-to-the-mouseevent-interface
Pointer Lock 2.0 # extensions-to-the-mouseevent-interface

Совместимость с браузерами

BCD tables only load in the browser

Посмотрите также

Its direct parent, UIEvent (en-US).