jquery selectable - Div和Canvas

Question

我正在使用jquery selectable插件并将其运行到以下情况。

请看一下这张图片

html5画布包含在DIV中。但画布有意大于DIV尺寸。圆角矩形总是DIV的大小。画布在DIV边界的每一边都比较大10像素。在上图中，蓝色边界代表画布。

我有jquery可选，它选择所有class =“mt_obj”的对象。

DIV被赋予此类，但画布未分配此类。

副作用是当我使用选取框选择（rubberband）时，如果它落在画布区域中，则对象被选中。因此，如果我在蓝色边框和圆角方形边框之间单击，则会选中该对象。所需的行为是仅在用户点击灰色方圆时选择。

这是HTML代码。 在jquery可选择或类选择中是否有一种方法可以避免选择它是否为画布对象？。我认为画布选择传播到DIV，因为div是画布的父级。

<div style="display: block; position: absolute; 
top: 181px; left: 217px; width: 398px; height: 34px; z-index: 1;" 
class="mt_obj ui-resizable ui-draggable ui-selected ui-resizable-autohide">
<canvas  style="position: relative; 
top: -10px; left: -17.4561px;" width="432" height="54">
</canvas>
</div>

Answer 1

这在黑暗中有点像，但我猜测可选择使用鼠标悬停，鼠标输出，鼠标中心和鼠标移动事件中的任何一个或全部来触发选择。考虑到这一点，在致电selectable后，您可能会做出类似的事情：

$("div.mt_obj canvas").bind("mouseover mouseout", function(event){
  event.stopPropagation();
}); 

您也可以尝试mouseenter和mouseleave事件。