Javascript $（窗口）.scroll（…）正在运行，即使模板在meteor中被破坏

我有两个单独的模板，在两个模板（渲染）中，我都在执行$（窗口）。滚动（），但是转到另一个模板，$（窗口）。滚动（）同时从上一个模板和当前模板运行

代码片段如下所示：

dashboard1.js

Template.dashboard1.rendered = function(){
    $(window).scroll(function() {
        console.log('dashboard1 scroll');
        //... doing pagination and sticky element for dashboard1
    });
}

Template.dashboard1.destroyed = function(){
    console.log('dashboard1 destroyed');
}

dashboard2.js

Template.dashboard2.rendered = function(){
    $(window).scroll(function() {
        console.log('dashboard2 scroll');
        //... doing pagination and sticky element for dashboard2
    });
}

Template.dashboard2.destroyed = function(){
    console.log('dashboard2 destroyed');
}

控制台：

dashboard1 destroyed
dashboard2 scroll
dashboard1 scroll
dashboard2 scroll
dashboard1 scroll
dashboard2 scroll

但如果我刷新浏览器，则它仅来自当前模板

---

为什么会发生这种情况？你知道吗？解决这个问题的方法是什么

在Meteor中销毁模板将对模板渲染引擎（

Blaze

）执行内部清理，并将注销通过模板事件映射声明的事件，但不会注销Meteor不知道的全局窗口事件

在使用

$在
onRendered
生命周期事件回调中注册自定义全局事件后。在

上，您需要使用

$在
onestroyed
回调中注销它。关闭

您可以使用此模式注册和注销处理程序：

Template.dashboard1.onRendered(function(){
  this.scrollHandler = function(){
    // you can use the this keyword here to reference the template instance
    console.log("dashboard1 scroll");
    //... doing pagination and sticky element for dashboard1
  }.bind(this);
  $(window).on("scroll" ,this.scrollHandler);
});

Template.dashboard1.onDestroyed(function(){
  $(window).off("scroll", this.scrollHandler);
  console.log("dashboard1 destroyed");
});

---

通过将此绑定函数附加为模板实例的属性，可以在事件处理程序中执行特定于模板实例的逻辑。

在Meteor中销毁模板将执行有关模板呈现引擎（

Blaze

）的内部清理，并将注销通过模板事件映射声明的事件，但它不会注销流星不知道的全球窗口事件

在使用

$在
onRendered
生命周期事件回调中注册自定义全局事件后。在

上，您需要使用

$在
onestroyed
回调中注销它。关闭

您可以使用此模式注册和注销处理程序：

Template.dashboard1.onRendered(function(){
  this.scrollHandler = function(){
    // you can use the this keyword here to reference the template instance
    console.log("dashboard1 scroll");
    //... doing pagination and sticky element for dashboard1
  }.bind(this);
  $(window).on("scroll" ,this.scrollHandler);
});

Template.dashboard1.onDestroyed(function(){
  $(window).off("scroll", this.scrollHandler);
  console.log("dashboard1 destroyed");
});

---

通过将此绑定函数附加为模板实例的属性，您可以在事件处理程序中执行特定于模板实例的逻辑。

当模板被销毁时，您需要手动删除侦听器

var scrollHandler = function() {
  console.log('dashboard1 scroll');
}

Template.dashboard1.rendered = function() {
  $(window).scroll(scrollHandler);
}

Template.dashboard1.destroyed = function() {
  $(window).off("scroll", scrollHandler);
  console.log('dashboard1 destroyed');
}

---

当模板被销毁时，您需要手动删除侦听器

var scrollHandler = function() {
  console.log('dashboard1 scroll');
}

Template.dashboard1.rendered = function() {
  $(window).scroll(scrollHandler);
}

Template.dashboard1.destroyed = function() {
  $(window).off("scroll", scrollHandler);
  console.log('dashboard1 destroyed');
}

---

干杯明白了，而且很好用。我还有一个问题要问你…哪一个更好$（window）.关闭（'scroll'）还是$（window）.取消绑定（'scroll'）？？使用

$。打开

和

$。关闭

，

$。绑定

和

$。取消绑定

是不推荐的，可能在未来版本的jQuery中删除。干杯！！明白了，而且很好用。我还有一个问题要问你…哪一个更好$（window）.关闭（'scroll'）还是$（window）.取消绑定（'scroll'）？？使用

$。打开

和

$。关闭

，

$。绑定

和

$。取消绑定

是不推荐的，可能在jQuery的未来版本中删除。