EaselJs canvas dragstart event not bubbling to parent

问题

I have a number of canvas elements, which need to be draggable. (not elements within the canvas element, i mean the actual canvas DOM node)

The code looks like this

<div class="top-parent" draggable="true">
  <div class="inner-parent">
     <canvas></canvas>
  </div>
</div>

If I just have a regular canvas element which hasn't been initialized with createjs the drag drop library i'm working works fine (I believe it works off the html5 dragstart event). If I use new createjs.Stage(canvas); the drag and drop functionality doesn't work, it appears that the dragstart event is not bubbling up, or perhaps not even being registered.

I tried stage.enableDOMEvents = true; this doesn't appear to work - which i guess makes sense because it should be the default option but I thought I would try anyway.

回答1:

EaselJS Stage instances call preventDefault() on native touch/mouse events by default, to prevent the canvas from being selected (and getting an ugly selection highlight). Try disabling this functionality by using: myStage.preventSelection = false;. That should let those events progress normally, which may allow your drag and drop library to function.

If you are not using mouse events in the Stage at all (ex. DisplayObject instances with click, mouseDown, etc handlers), you can completely unsubscribe the Stage from the DOM events by using: myStage.enableDOMEvents(false);. Note that enableDOMEvents is a method, whereas you are trying to use it as a property in your example.

来源：https://stackoverflow.com/questions/31366131/easeljs-canvas-dragstart-event-not-bubbling-to-parent