如何在向上滚动和向下滚动事件时运行一次功能？

Question

如何在向上滚动或向下滚动时运行doSomething（）一次？

window.onscroll = function(e) {
   // scrolling up
   if(this.oldScroll > this.scrollY){
      doSomething();
   // scrolling down
   } else {
      doSomething();
   }
   this.oldScroll = this.scrollY;
};

doSomething（）绑定了一些元素，我不想重复绑定。我只想在向上滚动时绑定一次，在向下滚动时绑定一次。

Answer 1

如果您的意思是，您的功能应该每 滚动事件执行一次，那么您的代码应该已经完成​​了工作。

但是，如果您的意思是希望您的功能仅在用户滚动时执行第一次，则代码可能如下所示：

window.onscroll = function(e) {
  if (this.oldScroll > this.scrollY) {
     doSomething();
  } else {
     doSomethingElse();
  }
  this.oldScroll = this.scrollY;

  delete window.onscroll;
};

NOT 依赖于任何类型的＆＃34;标志变量＆＃34;正如上面提出的那样。在这种情况下，这是一种非常糟糕的做法！

Answer 2

你可以选择定义闭包函数，并按照post

中描述的方式使用它。

除了上面的帖子，我遇到了这种情况，我使用以下方法来检查事件是否已经注册或者没有看到下面的函数我需要绑定点击一次只有我用typeof $._data ( elementClose.get ( 0 ), 'events' ) === 'undefined'来获取使用元素注册的事件$._data用于检索注册到元素/

的事件处理程序

this.closeButtonPreview = () => {
  let elementClose = $("a.close-preview");
  if (typeof $._data(elementClose.get(0), 'events') === 'undefined') {
    elementClose.on('click', function(e) {
      e.preventDefault();
      let container = $(this).parent();
      container.find('video').remove();
      $("#overlay,.window").effect("explode", {}, 500);
    });
  }
  return;
};

修改

为了让您了解我与$._data()使用的逻辑有关的概念。我在下面创建了一个例子。

我正在做的是将事件click绑定到条件id=unique内的if (typeof $._data(uniqueBind.get(0), 'events') == 'undefined') {，这决定了是否为该元素分配了一个事件并绑定了事件click在条件之外的锚id=multi而不检查元素上的绑定事件。

你需要做什么。

最初，按钮unique和multi无法将任何内容记录到控制台，点击EVENT BINDER一次，然后点击unique和{{1}他们都会在mutli中记录一次文本，但是当您一直点击console通知时，单击EVENT BINDER按钮将开始记录文本，因为您点击multi { {1}}按钮，但无论您点击EVENT BINDER按钮多少次，unique按钮都只会记录一次。

＆＃13;

＆＃13;

EVENT BINDER

＆＃13;

$(document).ready(function() {
  $('#binder').on('click', bindEvents);
  $('#clear').on('click', function() {
    console.clear();

  })
});

function bindEvents() {
  var uniqueBind = $('#unique-bind');
  var multiBind = $('#multi-bind');

  //will bind only once as many times you click on the EVENT BINDER BUTTON
  //check if any event is assigned to the element
  if (typeof $._data(uniqueBind.get(0), 'events') == 'undefined') {
    uniqueBind.on('click', function() {
      console.log('clicked unique bind');
    });
  }

  //will log the text EVENT BINDER * TIMES_EVENT_BINDER_CLICKED button 
  multiBind.on('click', function() {
    console.log('clicked multi bind');
  });

}

＆＃13;

body {
  text-align: center;
}

＆＃13;

＆＃13;

＆＃13;