Javascript 单击事件/内存泄漏有问题

我有以下JavaScript代码

    var Foo = function () {
      $('body').on('click', '.btn', this.update.bind(this));
    };

    Foo.prototype = (function () {

      var update = function (e) {
        console.log('update');
        e.preventDefault();
      };

      return {
        update: update
      }

    })();

    new Foo();
    new Foo();
    new Foo();

我正在创建3个

Foo

构造函数实例。在构造函数中，我将一个click事件附加到dom元素。但是，使用这种方法，单击事件会附加3次，因为我正在使用new操作符创建3个实例我如何使这项工作正常，以便在创建3个实例后，它只将一次单击事件附加到该dom元素？

这将删除单击事件侦听器，然后重新绑定它。这样，它只限于一个侦听器

这应该有效：

var binded = false;
var Foo = function () {
    if (!binded) {
        $('body').one('click', '.btn', this.update.bind(this));
        binded = true;
    }
};

---

这不是内存泄漏。如果多次绑定事件，jQuery就是这样工作的。如果您这样做：

$('body').on('click', '.btn', function(e){/*logic here*/});
$('body').on('click', '.btn', function(e){/*logic here*/});
$('body').on('click', '.btn', function(e){/*logic here*/});

var Foo = function () {
  if(!Foo.instantiatedOnce) {
    $('body').on('click', '.btn', this.update.bind(this));
  }
  Foo.instantiatedOnce = true;
};

Foo.prototype = (function () {

  var update = function (e) {
    console.log('update');
    e.preventDefault();
  };

  return {
    update: update
  }

})();

Foo.instantiatedOnce = false;

new Foo();
new Foo();
new Foo();

它将附加事件3次。为什么你认为如果你把这个东西放到一个类中并实例化这个类3次，它就不会附加事件了

防止这种行为的一种方法是这样做：

$('body').on('click', '.btn', function(e){/*logic here*/});
$('body').on('click', '.btn', function(e){/*logic here*/});
$('body').on('click', '.btn', function(e){/*logic here*/});

var Foo = function () {
  if(!Foo.instantiatedOnce) {
    $('body').on('click', '.btn', this.update.bind(this));
  }
  Foo.instantiatedOnce = true;
};

Foo.prototype = (function () {

  var update = function (e) {
    console.log('update');
    e.preventDefault();
  };

  return {
    update: update
  }

})();

Foo.instantiatedOnce = false;

new Foo();
new Foo();
new Foo();

---

这样做就像模拟实例之间共享的静态变量。

为什么需要3个实例？你想实现什么？

点击事件/内存泄漏有问题

什么？？？这确实不清楚您对实例化3次的期望是什么，因此如何期望它以不同的方式工作。我猜您发布的示例与您的实际用例并不相关