Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

What is the difference between jQuery off() and unbind()

I was using jQuery .bind() and .unbind() to handle an animation event on scroll.

$(window).bind('scroll', function(){
  ... code ...
  if(code_was_successful){
    $(window).unbind(e);
  }
});

As of 1.7 (I'm using 1.11) we're supposed to use .on() and .off(), but .off() seems to have no support for an event handler unbinding itself. For normal click events and such, I'd have to save the handler to a variable and set up another event handler to unbind it (which defeats the purpose), and for scroll events it's impossible since .off() requires a selector to unbind a specific handler, and scroll events can't have one.

What's the modern way to do this?

like image 918
Andrew Evans Avatar asked May 30 '14 18:05

Andrew Evans


3 Answers

What's the modern way to do this?

Use a named function expression:

$(window).on('scroll', function handler(){
  ... code ...
  if(code_was_successful){
    $(window).off('scroll', handler);
  }
});

.off() requires a selector to unbind a specific handler

No it does not. Just like .on doesn't require a selector. You only need the selector if you want to unbind a delegated event handler.

As you can read in the documentation of .off about the selector argument:

A selector which should match the one originally passed to .on() when attaching event handlers.

So if you didn't use one in .on, you don't use one in .off.

like image 108
Felix Kling Avatar answered Oct 07 '22 16:10

Felix Kling


you can use .on() and .off() like so:

function scrollHandler(e){
    if (myCondition) $(e.target).off('scroll', scrollHandler);
}

$(window).on('scroll', scrollHandler);
like image 2
Patrick Gunderson Avatar answered Oct 07 '22 14:10

Patrick Gunderson


Using off is the modern way, unbind is the old way. Use off.

See jquery documentation:

As of jQuery 3.0, .unbind() has been deprecated. It was superseded by the .off() method since jQuery 1.7, so its use was already discouraged.

like image 1
Jelle Avatar answered Oct 07 '22 14:10

Jelle