.net

.net

博客园 首页 新随笔 联系 订阅 管理

IE下给window对象定义其onresize事件,在拉伸缩小窗口时,其onresize方法将被执行多次,并且其具体执行的次数在不同的电脑有不同的值,相当诡异,Firefox等其他浏览器则无此现象。具体可参看这一篇文章《window.onresize hangs IE6 and IE7》

高阶函数debounce 正是为此而生的

 

/**
 * IE下 window.onresize 有bug 可以使用debounce封装监听函数 
 * see http://blog.csdn.net/fudesign2008/article/details/7035537
 * @author FuDesign2008@163.com
 * @date   2011-11-30
 * @time   下午04:02:55
 */

/**
 *
 * @param {Function} callback 回调函数
 * @param {Integer} delay   延迟时间,单位为毫秒(ms),默认150
 * @param {Object} context  上下文,即this关键字指向的对象,默认为null
 * @return {Function}
 */
function debounce(callback, delay, context){
    if (typeof(callback) !== "function") {
        return;
    }
    delay = delay || 150;
    context = context || null;
    var timeout;
    var runIt = function(){
            callback.apply(context);
        };
    return (function(){
        window.clearTimeout(timeout);
        timeout = window.setTimeout(runIt, delay);
    });
}
var winResizeHandler = function(event){
	  console.log("window resized");
};

window.onresize= debounce(winResizeHandler, 300);
posted on 2013-06-12 23:30  航宇  阅读(1080)  评论(0编辑  收藏  举报