0

我试图通过单击来破坏一个形状，但是在它被破坏之后，这个形状的 mouseleave 事件处理程序仍然被触发（控制台中的错误）。我假设 KineticJS 会解除对已破坏形状的所有事件的绑定。所以基本上问题是如果我想在 KineticJS 中销毁它，是否必须手动禁用形状中的所有事件侦听器。

这是 jsfiddle 的链接和代码：http: //jsfiddle.net/evNyp/8/

var stage = new Kinetic.Stage({
    container: 'container',
    width: 578,
    height: 200
});

var layer = new Kinetic.Layer();

// dashed line
var greenLine = new Kinetic.Line({
    points: [73, 70, 340, 23, 450, 60, 500, 20],
    stroke: 'green',
    strokeWidth: 10,
    lineJoin: 'round',
    dashArray: [10, 5],
    dashArrayEnabled: false
});

layer.add(greenLine);
stage.add(layer);

greenLine.on('mouseenter', function() {
    console.log('enter');
    this.setDashArrayEnabled(true);
    this.getLayer().draw();
});

greenLine.on('mouseleave', function() {
    console.log('leave');
    this.setDashArrayEnabled(false);
    this.getLayer().draw();
});

greenLine.on('click', function() {
    //this.off('mouseleave');
    this.destroy();
    layer.draw();
});
4

1 回答 1

0

您必须从 greenLine.on 事件处理程序外部调用 greenLine.destroy()。

原因：您不能销毁当前范围内的内容（greenLine 的事件处理程序仍在范围内）。

例如，您可以监听舞台上的点击并在该事件处理程序中销毁 greenLine。

$(stage.getContent()).on('click', function (event) {
    greenLine.destroy();
    layer.draw();
});

这是一个小提琴：http: //jsfiddle.net/m1erickson/BVyNF/

于 2013-10-10T03:31:21.267 回答