createjs防止超链接交互

时间:2016-09-12 13:38:44

标签: javascript javascript-events event-handling createjs easeljs

在我的简单应用程序画布中包含超链接。放置在画布舞台上的某些对象在click事件上具有特殊的鼠标交互。是否有任何可能的解决方案通过单击鼠标单击事件侦听器来阻止超链接跳转?

1 个答案:

答案 0 :(得分:1)

通常,您只需在生成的鼠标事件上调用preventDefault,它就会停止触发链接事件。

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

使用EaselJS是不可能的,因为虽然您可以访问任何EaselJS鼠标事件的nativeEvent,但EaselJS根本不使用“click”事件(而是使用“mousedown”和“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);

然后,自己监听画布点击事件,检查并检查标志。确保之后重置它。这是可能的,因为在“mouseup”

之后总是触发“click”
stage.canvas.addEventListener("click", function(event) {
     if (myShape.clicked) { event.preventDefault(); }
     myShape.clicked = false;
}, false);

这是一个快速的小提示,显示它正在工作。 http://jsfiddle.net/buqkvb1u/

我们正在考虑在EaselJS中处理这是否有意义。谢谢你的举报!