Изменить тип событий

Question

Можно ли изменить type события в JavaScript?

в этом сценарии я запускаю события с помощью jQuery на холсте, но на определенных элементах в этомхолст, как нарисованные формы или изображения.

mousemoveevent ---> [canvas] -> [find element] ---> mousemoveoverelementevent

По сути, я ловлю событие onmousemove по всему холсту с помощью:

$('canvas').bind('mousemove'........

, но DOM не существует в пределах холста, поэтому я хочу, чтобы оно трансформировалось (чтобы потом подцепитьв процессе):

$('canvas').bind('mousemoveOverElement'........
$('canvas').bind('mouseenterOnElement'........
$('canvas').bind('mouseleaveOnElement'........

, а затем назначить что-то вроде

e.element = 'imageAtACertainPositionInTheCanvas'

Я предпочитаю передавать измененное событие вместо назначения нового обратного вызова.

Answer 1

• CanvasScript3 предлагает библиотеку с определенными функциями, такими как события. Есть несколько вещей для события MouseOver , MouseOut . Проверьте список тестов .
• В предыдущих вопросах stackoverflow есть также примеры связывания событий с «элементами» Canvas.
• Учебник по наведению указателя мыши на прямоугольный холст HTML5

Возможно, вы захотите прочитать вопрос о Sprite и Canvas и их сравнительно плохих характеристиках.

Answer 2

Я не понял, что вы сказали, может быть, вы могли бы быть более конкретным.

Я знаю, что вы можете изменить тип пользовательского события .

// Custom mouse events
var myEvent = document.createEvent ("MouseEvents");

// Click
myEvent.initMouseEvent ("click", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);

// Dispatch
link.dispatchEvent (myEvent);

// Changed the type
myEvent.initMouseEvent ("mousemove", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);

// Dispatch
link.dispatchEvent (myEvent);

В любом случае эти ссылки могут вам помочь:

События уровня DOM 3

nsIDOMWindowUtils

Answer 3

[ Пример ]

var img = new Image();
img.src = "...";
var $img = $(img);

$img.mousemove(function(_, e){
  console.log(e.pageX);                    
});

$('canvas').mousemove(function(e){
  if (mouse_over_image(e.pageX, e.pageY)) {
    e.target = img;
    $img.trigger("mousemove", e);
  }
});

Answer 4

Я полагаю, что вы ищете ответ ' jQuery custom event '. Пользовательское событие jQuery предоставляет вам возможность присваивать имена и организовывать ваши обработчики событий; эти обработчики событий могут быть вызваны $(el).trigger('the_event'). Просто Google для слова для использования и пример.

Я не могу перезаписать объект события, как, например, e.element вы предложили. Возможно, вам придется переосмыслить поток, чтобы соответствовать ему.

(Не то, чтобы этот ответ стоил 200 репутации, но в любом случае, надеюсь, вам будет полезно найти способ.)