Question

所以我正在编写可移动SVG对象的实现。（我确实希望自己这样做，因为我需要一些特殊的功能）
对于每个SVG，我都有一个带有额外数据的JS-Object等在构造函数中，我创建了一个SVG元素并将其附加到SVG。

var self; // maybe this is a problem? I need it for prototyping and the whole code is wrapped in a factory function

var Scooter = function(id) {
    this.id = id; // this is just n-th instance
    this.svgElement = document.createElementNS(SVG_NS, "g");
    // doing some extra svg stuff
    SVG.appendChild(this.svgElement);

    self = this; // need this for the listener

    // **1**
}

现在我想添加可拖动功能，所以我仍然在构造函数中绑定一个事件监听器。（请参阅上面代码示例中的**1**）

$(self.svgElement).on("mousedown", function(e) {
    // do sth for making it draggable
    console.log(self);
}

确定。现在，如果我正在创建一个实例，它可以正常工作。当我添加第二个实例时，一切似乎都很好。我可以移动第二个，就像它应该的那样。但是，如果我再次拖动第一个，它将移动第二个（或最后创建的）对象！

每个SVG元素都完美显示，我认为每个都有自己的处理程序。但是如果我从第一个对象检查处理程序的闭包变量，self现在会给我对最新对象的引用。

有人可以解释为什么会发生这种情况并且可能会建议一个变通？

Answer 1

好像

var Something = (function(){
   //constructor
   function Something(){
     ....
   }

   Something.prototype = {
     func1: function() {
     },
     func_n: function() {
     }
   };
   return something;
})()

没有自我

关闭不使用多个对象的事件侦听器？

1 个答案: