Question

点击对象时，我试图点击鼠标右键，就像鼠标左键一样。这是我一直在玩的代码：

$(".upper-canvas").bind('contextmenu', function (env) {
    canvas.on('mouse:over', function(e) {
        canvas.setActiveObject(e.target);
    });
    return false;
})

但它并没有像我想象的那样表现。右键单击一个对象后，它不会选择该对象，但随后会随后连续选择悬停时的元素。

我或许是天真的，假设悬停事件只会在右键单击时激活一次。

Answer 1

只要您只使用对象，这应该有效：

$(".upper-canvas").bind('contextmenu', function(ev) {
    var pointer = canvas.getPointer(ev.originalEvent);
    var objects = canvas.getObjects();
    for (var i = objects.length - 1; i >= 0; i--) {
        if (objects[i].containsPoint(pointer)) {
            canvas.setActiveObject(objects[i]);
            break;
        }
    }

    if (i < 0) {
        canvas.deactivateAll();
    }

    canvas.renderAll();

    ev.preventDefault();
    return false;
});

当用户右键单击画布时，它会获得点击的（x，y）坐标。然后它查看画布中的所有对象，并选择一个包含该点的对象。我相信结构在对象列表中以相反的顺序保留z顺序，所以这应该尊重它，因为它向后通过列表。如果单击没有选择任何对象，则它将取消选择任何选定的对象。最后，它会阻止默认值并返回false以防止正常的右键单击弹出。

这应该可以很好地处理对象，但它可能不会很好地与群组一起工作。

fabric js选择右键单击对象

1 个答案: