javascript - createjs防止超链接交互

Question

在我的简单应用程序 Canvas 中，由超链接包裹。放置在 Canvas 舞台上的某些对象在 click 事件上具有特殊的鼠标交互。是否有任何可能的解决方案可以通过使用鼠标单击事件监听器单击对象来防止超链接跳转？

Answer 1

通常，您只需在生成的鼠标事件上调用 preventDefault 即可，它将阻止链接事件触发。

element.addEventListener("click", function(e) { 
    e.preventDefault(); 
}, false);

使用 EaselJS 是不可能的，因为尽管您可以访问任何 EaselJS 鼠标事件上的 nativeEvent，但 EaselJS 根本不使用“click”事件(而是使用“mousedown”的组合”和“鼠标悬停”)。因此，阻止点击事件的默认设置不会起到任何作用。

不起作用

// You would expect this to work.
myShape.on("click", function(e) {
    e.nativeEvent.preventDefault(); // Nothing. This cancels a "mouseup" instead.
});

解决方法

但是，您可以很容易地解决这个问题。每次单击时，都会在所单击的项目(或应用程序中的任何位置)上设置一个标志。

myShape.addEventListener("click", function(event) {
  myShape.clicked = true;
}, false);

然后，自己监听 Canvas 点击事件，检查并检查标志。请务必在之后重置它。这是可能的，因为“click”总是在“mouseup”之后触发

stage.canvas.addEventListener("click", function(event) {
     if (myShape.clicked) { event.preventDefault(); }
     myShape.clicked = false;
}, false);

这是一个显示其工作原理的快速 fiddle 。 http://jsfiddle.net/buqkvb1u/

我们正在寻找在 EaselJS 中处理这是否有意义。感谢您的报告!