ipad 上的 Kinetic JS touchstart/touchend 混淆

Question

我无法调试此问题：如果您在 iPad 上查看此 jfiddle，您会看到您可以单击每个圆圈来更改上面的内容。当您按住一个圆圈时，您会看到它变成绿色（图像交换）。

http://jsfiddle.net/SWj9m/

现在，用你的手指按住一个，然后向上拖动你的手指，或者在按住前一个的同时用另一个手指单击另一个环。现在，iPad 触摸事件变得混乱，绿色（touchstart）事件留在原地而不是离开。我们最终会看到多个圆圈卡在绿色中，这意味着 touchend 事件从未发生过。

有人以前见过这个问题，或者知道如何进行调试吗？

这个 sn-p 显示 touchstart/end 事件

                    applications.on('touchstart mouseover', function() {
                        writeMessage(messageLayer, 'touchstart applications circle');
                        this.setFill({ image: images.applicationshover});
                        layer.draw();
                    });
                    applications.on('touchend mouseout', function() {
                        writeMessage(messageLayer, 'Mouseup applications circle');
                        this.setFill({ image: images.applicationsimage});
                        layer.draw();
                    });

Answer 1

我几乎不是 kineticjs 的初学者，但我会试一试，因为这个问题已经有一段时间没有得到解答了。

不幸的是，触摸和鼠标事件并没有像您希望的那样相互平行。 “touchstart”类似于“mousedown”而不是“mouseover”，“touchend”类似于“mouseup”而不是“mouseout”。我在自己的一些代码中遇到了类似的问题。

我对此的最佳想法是使用“mouseover”和“touchmove”，它们似乎是类似的。在任何环中的 mouseover/touchmove 或 mousedown/touchstart 上，将该环设置为绿色，并将 all 其他环设置回蓝色。此外，在 mouseup/touchend 上将所有环设置为蓝色。

这仍然留下一个未处理的情况，当用户触摸外环，然后移到背景，然后结束触摸。您正在使用“mouseout”来处理桌面，但没有“touchout”可以为 ipad 做同样的事情。在类似情况的代码中，我为 window.touchend 添加了一个侦听器。我还没有尝试过，但我的另一个想法是有一个具有舞台大小的矩形的图层作为背景图层，并注意该对象上发生的触摸结束。

如果这不是解决这个问题的最佳方式，那么希望真正知道他们在说什么的人会站出来纠正我！