代码改变世界

事件延迟触发

2010-05-01 00:19  BlueDream  阅读(1185)  评论(4编辑  收藏  举报

浏览器中有些敏感事件一旦触发会频繁发生.比如onScroll, onmousemove , onresize等触发频率很快.很耗内存.

平时的应用场景比如:

tabView是通过mouseover触发的.当用户迅速从页面滑过是不会触发的.必须要停滞一会才触发.

还有ajax频繁请求等.都会耗很大的内存资源.那么我们就需要一个事件控制函数.让事件以一定频率的发生.

下面演示了两个div第一个是普通的mousemove.第二个是延迟后的mousemove在计数器上可以看出频率的差别. 

onMouseMove0
onMouseMoveEnd0

【延迟函数】

var lazyTrigger = function() {
    var delay = 50, timer = null;
    return function(callback) {
        if ( !!timer ) {
            clearTimeout(timer);
        } 
        timer = setTimeout(callback, delay);    
    }
}();