如何防止单击形状后面的形状在createjs中触发

Question

我向 Whosebug 提出的第一个问题，请多多包涵。

我在 createjs 舞台上有两个形状。第一个 background 覆盖了整个舞台，并在 click 上定义了一个侦听器。我想在这个上面放另一个形状，这个不应该触发背景上定义的点击侦听器。

在下面的示例中，单击红色 circle 会触发 background 的侦听器。

var stage = new createjs.Stage('c');

var rect = new createjs.Shape();
rect.graphics.beginFill('#0000ff').drawRect(0, 0, 50, 50);

var background = new createjs.Shape();
background.graphics.beginFill('#000000').drawRect(0, 0, 500, 500);
background.alpha = 0.7;
background.on('click', function () {
  circle.visible = !circle.visible;
  stage.update();
});

var circle = new createjs.Shape();
circle.graphics.beginFill('#ff0000').drawCircle(225, 225, 50);

// circle.on('click', function () {});

stage.addChild(rect);
stage.addChild(background);
stage.addChild(circle);

stage.update();

https://codepen.io/anon/pen/rKmPOY

我发现，如果我在圆圈上放一个空的 click 侦听器，我就得到了我想要的，但这感觉很尴尬。

这里正确的方法是什么？这不应该是一个冒泡的问题，因为 background 和 circle 是兄弟姐妹。还是我完全错了？

Answer 1

如果某些东西没有点击侦听器，则在单击鼠标时不会对其进行评估。这绝对是一个理想的行为（让你不想阻止点击的东西更烦人）。

您添加空侦听器的解决方法很好，而且非常典型。

我能想到的唯一其他选择是检查单击鼠标下方的内容，然后手动过滤它，这样工作更多。

干杯，

如何防止单击形状后面的形状在createjs中触发

How to prevent a shape behind a clicked shape to trigger in createjs

createjs