jQuery – 鼠标经过(hover)事件的延时处理

说到延时，离不开window下的setTimeout方法，本实例的jQuery方法的核心也是setTimeout。代码不长，完整如下:

(function ($) {
$.fn.hoverDelay = function (hoverEvent, outEvent) {
var hoverTimer, outTimer;
return $(this).each(function () {
$(this).hover(function () {
var t = this;
clearTimeout(outTimer);
hoverTimer = setTimeout(function () {
hoverEvent.call(t);
}, 200);
}, function () {
var t = this;
clearTimeout(hoverTimer);
outTimer = setTimeout(function () {
outEvent.call(t);
}, 200);
});
});
}
})(jQuery);

基本上都是代码在撑页面，说点有用的东西吧。

hoverDelay

方法共四个参数，表示意思如下：

hoverDuring 鼠标经过的延时时间
outDuring 鼠标移出的延时时间
hoverEvent 鼠标经过执行的方法
outEvent 鼠标移出执行的方法