我们可以克隆像 MS Word、ctrl + 鼠标单击 + 拖动这样的对象吗答案

【问题标题】：Can we clone objects like MS Word , ctrl + mouse click + drag我们可以克隆像 MS Word、ctrl + 鼠标单击 + 拖动这样的对象吗
【发布时间】：2015-06-29 17:07:31
【问题描述】：

在我的 fabricjs 应用程序上，我在一个对象上单击 ctrl + 鼠标左键，然后克隆它，到目前为止一切都很好。关键是我想在 MS WORD 中进行克隆，即 ctrl + 单击 + 拖动。

以前有人做过类似的事情吗？谢谢，这对我的项目很重要。

我的职能是：

**here i make true the flag**


 fabric.Canvas.prototype.__onMouseDown = function (e) {    
              //left click is pressed
              lpressed = true;
    }

   **if the user prsees ctrl + left mouse + move , i create a new object**
      $(document).mousemove(function(e){
          console.log('mouse move');
          if(e.ctrlKey && lpressed){
              if(canvas.getActiveObject()){
                  var actObj = canvas.getActiveObject();
                  var toBack = true;
                  addCirlceTable(canvas.getActiveObject().left,canvas.getActiveObject().top,8,45,toBack);

                  canvas.renderAll();
                  //i select the original object which it comes on the foreground, over the new object
                  canvas.fire('object:selected', {target:actObj, e:e});
                  actObj.fire('selected',{e:e});
              }
          }
      });

//here i disable the flag
canvas.on('mouse:up', function(o){
      lpressed = false;
}

所以，代码的流程是这样的：
1. 选择一个对象
2.调用我创建一个新的函数
3.我把新对象放在背景上（在原来的下面）
4.我手动重新选择原始对象
5. 我需要移动原始对象！

第 5 步不起作用，我必须松开左键，然后重新单击原件（虽然它已被选中），才能移动原件。

【问题讨论】：

看起来是正确的策略。您只需要正确处理 mousedown/mouseup 事件即可。

标签： javascript php jquery html5-canvas fabricjs

【解决方案1】：

是的，你是对的，它们没问题，克隆过程就像我想要的那样工作，ctrl + 鼠标拖动。我只是更改了移动功能，而不是一般的 dom 事件$(document).mousemove(function(e){})

我使用织物移动事件：canvas.on('object:moving',function(e){});

【讨论】：