单击时克隆项目（Html5-canvas）

Question

我是 html5-canvas 的新手，我遇到了一些问题。下面的代码将在单击对象时克隆一个对象，也可以拖动它。但它只能工作一次，当我再次单击该对象时，克隆将移回其原始原点。每次单击它时如何多次克隆？并使克隆在拖动时保持原位。这是预览item = new lib.item104();this.addChild(item);item.x = 250;item.y = 350;item.scaleX = item.scaleY = 1;var Clone;Clone = new lib.anim104();item.addEventListener("click", itemPressed.bind(this));function itemPressed(evt) {    this.addChild(Clone);    Clone.x = 250;    Clone.y = 200;    Clone.scaleX = Clone.scaleY = 1.5;}Clone.addEventListener("pressmove", dragClone.bind(this));function dragClone(evt) {    var p = this.globalToLocal(evt.stageX, evt.stageY);    evt.currentTarget.x = p.x;    evt.currentTarget.y = p.y;}

Answer 1

我无法对此进行测试，因为我没有您的上下文，但我认为您需要做的就是将所有处理 Clone 的代码放在事件侦听器中，就像我在下面所做的那样。

这样，每个事件都会创建一个新的克隆副本，您遇到的冲突应该会消失。

item = new lib.item104();

this.addChild(item);

item.x = 250;

item.y = 350;

item.scaleX = item.scaleY = 1;

item.addEventListener("click", itemPressed.bind(this));

function itemPressed(evt) {

  var Clone;

  Clone = new lib.anim104();

  this.addChild(Clone);

  Clone.x = 250;

  Clone.y = 200;

  Clone.scaleX = Clone.scaleY = 1.5;

  Clone.addEventListener("pressmove", dragClone.bind(this));

}

function dragClone(evt) {

  var p = this.globalToLocal(evt.stageX, evt.stageY);

  evt.currentTarget.x = p.x;

  evt.currentTarget.y = p.y;

}