删除滚动事件未按预期进行

Question

I have the following code structure:

function somefunc(m) {
   function anotherfunc() {
      ...
      if ( m > ... 
      ...
   }
   console.log($._data(window).events.scroll);
   // $(window).off("scroll");
   $(window).off("scroll", anotherfunc);
   $(window).on("scroll", anotherfunc);
}
checkfunc() {
   if (...) {
      somefunc("1");
   }
   else (...) {
      somefunc("2");
   }
}
$(window).resize(function() {
   checkfunc();
});

Please don't mind the "logic" of m and binding/unbinding scroll event, and what I'm trying to achieve by it, the problem(and the question) is why can't I unbind the scroll event.

The thing is, when I use:

$(window).off("scroll", anotherfunc);
$(window).on("scroll", anotherfunc);

in the above example, I assume that each time on window resize it will unbind previous scroll event of anotherfunc and bind a new one, but instead(as it can be seen by console.log($._data(window).events.scroll); it multiply it each time...

For testing purpose I tried to remove the $(window).off("scroll", anotherfunc); and put instead of it $(window).off("scroll"); , and surprisingly it did unbind all previous scroll events.

My question is what is the difference here, because there's no other scroll events in there, so why

$(window).off("scroll", anotherfunc);
$(window).on("scroll", anotherfunc);

doesn't work the same way?

Answer 1

I think the correct syntax would be :

$(window)
   .off("scroll") // Remove all scroll events. No callback or other action needed.
   .on("scroll", anotherfunc)