выбор jquery - Div и холст

Question

Я использую подключаемый модуль jquery и запускаю его в следующей ситуации.

Пожалуйста, посмотрите на это изображение

Холст html5 заключен в DIV. Но холст специально больше, чем размер DIV. Круглый прямоугольник всегда имеет размер DIV. Холст больше, скажем, на 10 пикселей с каждой стороны границы DIV. На изображении выше синяя граница представляет холст.

У меня есть выбор jquery, и он выбирает все объекты класса = "mt_obj".

DIV назначен этот класс, но холсту не назначен этот класс.

Побочный эффект - когда я использую выделение (резиновая полоса), и если он попадает в область холста, то объект выделяется. Поэтому, если я нажму между синей рамкой и закругленной квадратной рамкой, объект будет выделен. Желаемое поведение - выбирать только тогда, когда пользователь нажимает на серый квадрат округлителя.

Вот код HTML. Есть ли способ в jquery selectable или class selection, чтобы избежать выделения, если это объект canvas? . Я думаю, что выбор canvas распространяется на DIV, поскольку div является родителем canvas.

<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

Это небольшой выстрел в темноте, но я предполагаю, что для выбора используется любое или все события mouseover, mouseout, mouseenter и mouseleave для запуска выбора.Имея это в виду, вы можете сделать что-то подобное после того, как позвоните selectable:

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

Вы также можете попробовать там события mouseenter и mouseleave.