在 Kinetic.js 中通过多个层处理事件？答案

【问题标题】：Handle events through multiple layers in Kinetic.js?在 Kinetic.js 中通过多个层处理事件？
【发布时间】：2012-09-05 03:43:49
【问题描述】：

我在 layer1 上有一个圆圈，然后在 layer2 上有一个正方形。圆的直径是正方形的宽度，它们的中心相同，圆在正方形的顶部。我该如何设置，以便如果我在 layer1 上触发任何事件，相同的事件将在 layer2 的同一位置执行。所以在这种情况下，如果我点击圆形，也会触发方形的点击事件。当然，这并不意味着我只是想将圆圈的事件与正方形的事件挂钩，而是我基本上希望在两个图层上都触发事件。

例如如果

circle.on( "click", function() {
    alert("foo");
});

square.on( "click", function() {
    alert("bar");
});

然后点击圆心应该触发方形点击事件。

而不是由

circle.on( "click", function() {
    alert("foo");
    square.simulate("click"); // don't want this
});

【问题讨论】：

标签： javascript events event-handling dom-events kineticjs

【解决方案1】：

如何将圆形和正方形添加到组中，然后将点击事件附加到组中？

【讨论】：

【解决方案2】：

Kinetic 有两件事可以帮助您。

getIntersections() -- 返回鼠标点击点下的所有形状
fire() -- 触发事件

Kinetic 文档提到 getIntersections() 执行速度很慢，所以他们更喜欢 getIntersection()，但我从来没有使用过，所以我不能说多少。

http://kineticjs.com/docs/Kinetic.Stage.html#getIntersection

希望这会有所帮助。

【讨论】：