Bug Tracker

Opened 12 years ago

Closed 11 years ago

Last modified 8 years ago

#2250 closed enhancement (invalid)

Addition of "delayed" method to jQuery

Reported by: bfattori Owned by:
Priority: minor Milestone: 1.3
Component: core Version: 1.2.2
Keywords: delayed, timeout Cc:
Blocked by: Blocking:

Description

Purpose: delays execution of a call to jQuery object by a set amount of time. Unlike just setting a simple timeout, the "this" pointer inside the executed callback will be the jQuery object used to assign the delay. For example:

delayedFadeOut: function(delay, speed, callback) {
	this.delayed(delay, function() {
		this.fadeOut(speed, callback);
	});
	return this;
}

Thus, you could write:

var myFn = ;

$(".myClass").delayedFadeOut(250, "normal", 
	function() {
		$(this).css("background-color", "blue");
	});

Within the callback, you have access to the jQuery object so, in the example, all of the elements with the "myClass" class would get the background color of blue when the fade completes. The nice part is, the fade doesn't occur until the timeout has expired.

Here is the new method:

delayed: function(delay, callback) {

	var delayFn = function() {
		arguments.callee.jQ.each(function() {
			arguments.callee.callback.call(arguments.callee.jQ);				
		});
	};
	delayFn.jQ = this;
	delayFn.callback = callback;

	return setTimeout(delayFn, delay);
}

I use method wrapping to avoid closures and memory leaks in the delayFn method below. An example of my use is to delay a hover state so that the overlayed button doesn't appear immediately. I find this very handy instead of creating a ton of "window.timeout" calls.

Change History (2)

comment:1 Changed 12 years ago by bfattori

Arggg... ignore the "var myFn = ;" in the second code block. :-/

comment:2 Changed 11 years ago by flesler

Milestone: 1.2.31.3
Resolution: invalid
Status: newclosed

This is really not needed on the core. You can surely make a plugin to add thi functionality externally.

Note: See TracTickets for help on using tickets.