javascript - 点击对象未注册

Question

我找不到我做错了什么，因为当我单击 Canvas 上的三 Angular 形对象时，e.target 的值为 false。对于其他类型的对象(线、圆...)，“objectname”获取其值。

canvas.on('mouse:down', function(e) {
    if (e.target) {
        objectname = e.target.name;
    }
});

我必须检查什么，或者您可以指导我如何继续调试这个错误吗？

我怀疑“selectable=false;”或“deactivateAll();”可能是造成这个问题的原因，我进行了文本搜索，但没有结果。

接下来是物体的照片。我可以单击除三 Angular 形之外的任何对象，我将获得对象的名称。 objects on canvas

我不需要新的代码来获取 Canvas 上对象的名称。我的代码片段适用于除三 Angular 形之外的所有对象。这是我对三 Angular 形对象的代码造成了一些混淆。现在，当我单击三 Angular 形时，鼠标:向下未注册。而且我无法调试这个。这就是问题所在。

我会以其他方式问，我必须做什么才能防止在单击要触发的特定对象时触发 mouse:down 事件？

因为很明显我是用三 Angular 形来做的，因为现在我遇到了这个问题。

接下来是一个更好的例子。

 canvas.on('mouse:down', function(e) {
         if (e.target) {
               console.log('e.target is: '+e.target.type);
         }else {console.log('e.target is null ';}
    }

通过单击除三 Angular 形之外的任何对象，我得到 e.target.type。我确实检查了所有对象的objects[i].selectable，并且在所有情况下我都得到了true(即使对于三 Angular 形)。

Answer 1

假设您因为 .on() 函数而使用 jQuery，则可以通过这种方式获取 Canvas 的 name，将点击与 绑定(bind).on('点击', function(){...}

var canvas = $('#myCanvas');
canvas.on('click', function(e) {      
   if (e.target) {    
          objectname = $(e.target).attr('name');
          console.log(objectname);
   }
});

canvas{
  border: 1px solid black;
  cursor: pointer;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<canvas id="myCanvas" name="This is my canvas"></canvas>