Geek Answers Handbook

Work with $ (this) when there are multiple selectors

Now that there is an animate-like effect applied to multiple selectors

$('.foo,.bar').animate({width: '250'}, 'slow',function(){ console.log($(this)); });

Console log is returned twice for .foo and .bar

So how can I create other events based on this .foo .

Something like this $(this)+'.foo' < this is not true

I need to do other events based on (this) .foo location

+4
source share
2 answers

Make a separate selector for $('.foo') or filter the existing selector with filter('.foo') . In the beginning, it would be better to bind the animation / events to the correct set of elements.

Or check, in the animate callback, $(this).is('.foo') or $(this).hasClass('foo') . This approach would be better if your animation / events were already connected, but you need to figure out which of the DOM elements they were running.

As a rule, binding things exactly the way you want (first approach) is best, but it depends on what exactly you are trying to do.

See:

+6
source

Use .filter()

 $(this).filter('.foo').dosomething()

If this is a .goo element, then $(this).filter('.foo') will not return anything, so the actions after that will not affect the .goo elements

+2
source

More articles:


All Articles