在jQuery 1.4之前启用delay()的使用

前几天,我试图将HTML模板转换为CMS系统,但delay()在模板的JavaScript中使用jQuery函数,却发现了一个绊脚石。在模板制作过程的一部分中,我发现页面上发生以下错误。

Uncaught TypeError: Object #<an Object> has no method 'delay'

该错误似乎来自jQuery核心,并且它找不到名为的方法delay()。查看delay()手册页,我可以看到它仅包含在jQuery 1.4中,因此导致了错误,因为该方法在我使用的jQuery版本中不存在。这里的问题是我使用Drupal 6作为CMS,它具有jQuery 1.2.6。即使有了诸如jQuery更新模块之类的第三方解决方案,我也无法完全了解所需的版本。因此,我不得不寻找一种delay()无需将jQuery升级到1.4版就可以包含的方法。

解决方案是将jQuery.fn.extend语句添加到JavaScript页面库中,以便该delay()方法可用于页面上其余代码。下面是创建该delay()方法的代码,可以将其放置在页面上的任何位置,尽管最好将其放在您的主JavaScript文件中。

/**
 * Add in the extend function, added in Jquery 1.4 (which we don't have)
 */
jQuery.fn.extend({
	// 基于Clint Helfers的许可,基于该插件。
	// http://blindsignals.com/index.php/2009/07/jquery-delay/
	delay: function( time, type ) {
		time =jQuery.fx? jQuery.fx.speeds[time] || time : time;
		type = type || "fx";
 
		return this.queue( type, function() {
			var elem = this;
			setTimeout(function() {
				jQuery.dequeue( elem, type );
			}, time );
		});
	}
});

现在,您可以使用以下代码,而不会出现任何错误。

$("div.first").slideUp(300).delay(800).fadeIn(400);