Программирование JavaScript на базе библиотеки JQuery

Объект Event

содержит информацию о произошедшем событии
его необходимо явно передать в обработчик

Свойства Event

Cвойства

coordX .b-pad__coord_x
coordY .b-pad__coord_y
target .b-pad__coord_target
coordXrel .b-pad__coord_x-relative
coordYrel .b-pad__coord_y-relative
keyinfo .b-pad__coord_keyinfo
text .b-pad__text

Методы

showCoords
clickPad
clickX
showKeyinfo

События мыши

mousedown
Привязывает или вызывает функцию, код которой будет выполнен после

Назначаем методы на события

this.pad.mousemove(this.showCoords.bind(this))
this.pad.click(this.clickPad.bind(this));
this.coordX.click(this.clickX.bind(this));
this.text.keydown(this.showKeyinfo.bind(this));

showCoords(event)

Записываем координаты в div
this.coordX.html(event.pageX);
this.coordY.html(event.pageY);
Записываем в div имя класса
текущего элемента
this.target.html($(event.target).attr('class'));

Метод оформления position()

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

showCoords()

this.coordXrel.html(event.pageX -this.pad.position().left);
this.coordYrel.html(event.pageY - this.pad.position().top);

clickPad()

console.log('Click PAD');

Методы Event

clickX()

console.log('Click Coord X');
event.stopPropagation();

Атрибуты событий

дополнительная информацию о вызове события