JQuery: if inside a chain?

Question

I have it

if(noDelay){ $(element).find("." + options.class).remove(); } else { $(element).find("." + options.class).fadeOut().remove(); } 

Is there a way to avoid repeating the sentence and add only fadeOut() when this condition is met?

I cannot move fadeOut() to the end of the chain, which would probably simplify.

I think something like

 $(element).find("." + options.class).(if(noDelay) fadeOut()).remove(); 

Thanks in advance Leo

Answer 1

There is nothing documented as you want, but maybe this will work for you:

 $(element).find("." + options.class).fadeOut(noDelay ? 0 : 400).remove(); 

Why 400, because the default duration for fadeOut is 400 milliseconds. ( from the documentation )

Answer 2

You can do this with $ .fn.each:

 $(element).find("." + options.class).each(function(){ if (nodelay) { $(this).remove(); } else { $(this).fadeOut().remove(); } }); 

however, it is much less effective than just doing what you are already doing.

Edit: here is another way to do this:

 $(element).find("." + options.class)[ noDelay ? "detach" : "fadeOut" ]().remove(); 

in principle, if noDelay is true, it will detach the elements before deleting, otherwise they will disappear before deleting. Should be as effective as your code, on just 1 line.

Answer 3

Any objection to something like that?

 var $found = $(element).find("." + options.class); if (noDelay){ $found.remove(); } else { $found.fadeOut().remove(); } 

Answer 4

 var els = $(element).find("." + options.class); if (!nodelay) els.fadeOut(); els.remove(); 

Or you can use a terrible hack:

 $(element).find(…)[ nodelay ? 'somenoopfunction' : 'fadeOut' ]().remove(); 

Answer 5

This particular problem:

Try rethinking the logic a bit and make noDelay actual delay effect.

 $(element).find("." + options.class).fadeOut(noDelay ? 0 : 'normal').remove(); 

Although I'm not sure if remove() is required.

When I did the fadeOut() tests for another question, it seemed to hide and collapse the element. remove() will completely remove the element from the DOM, but I'm not sure if this is necessary if you just want it to disappear from the document and not stop working with the document flow (without spaces where it was).

The real goal:

Also, it looks like you're planning on porting jQuery. You end up wrapping the code like this:

 $("someElement").find(".someClass").fadeOut().remove(); 

... and changing it to something like:

 fadeOut("someElement", { "class" : "someClass" }); 

... or:

 var element = new SomeClass("someElement"); element.options.class = "someClass"; element.fadeOut(); 

If you plan on reusing this particular element, I think you're going to waste your time. jQuery has a pretty efficient syntax for one-time operations, and you can always store consistent elements in a temporary variable.

If you have any other goal in mind that I am missing, please excuse this intrusion into your design :)