修复lte ie8 & chrome 下window 的resize 事件多次执行

 

/**
* window.onresize 事件 专用事件绑定器 v0.1 Alucelx
* http://www.cnblogs.com/Alucelx/archive/2011/10/20/2219263.html
* <description>
* 	用于解决 lte ie8 & chrome 及其他可能会出现的 原生 window.resize 事件多次执行的 BUG.
* </description>
* <methods>
* 	add: 添加事件句柄
* 	remove: 删除事件句柄
* </methods>
*/
var onWindowResize = function(){
	//事件队列
	var queue = [],

	indexOf = Array.prototype.indexOf || function(){
		var i = 0, length = this.length;
		for( ; i < length; i++ ){
			if(this[i] === arguments[0]){
				return i;
			}
		}

		return -1;
	};

	var isResizing = {}, //标记可视区域尺寸状态， 用于消除 lte ie8 / chrome 中 window.onresize 事件多次执行的 bug
	lazy = true, //懒执行标记

	listener = function(e){ //事件监听器
		var h = window.innerHeight || (document.documentElement && document.documentElement.clientHeight) || document.body.clientHeight,
			w = window.innerWidth || (document.documentElement && document.documentElement.clientWidth) || document.body.clientWidth;

		if( h === isResizing.h && w === isResizing.w){
			return;

		}else{
			e = e || window.event;
		
			var i = 0, len = queue.length;
			for( ; i < len; i++){
				queue[i].call(this, e);
			}

			isResizing.h = h,
			isResizing.w = w;
		}
	}

	return {
		add: function(fn){
			if(typeof fn === 'function'){
				if(lazy){ //懒执行
					if(window.addEventListener){
						window.addEventListener('resize', listener, false);
					}else{
						window.attachEvent('onresize', listener);
					}

					lazy = false;
				}

				queue.push(fn);
			}else{	}

			return this;
		},
		remove: function(fn){
			if(typeof fn === 'undefined'){
				queue = [];
			}else if(typeof fn === 'function'){
				var i = indexOf.call(queue, fn);

				if(i > -1){
					queue.splice(i, 1);
				}
			}

			return this;
		}
	};
}.call(this);

绑定window 的 resize 事件，请使用这个对象

示例：

var _fn = function(){document.body.innerHTML += "1"};
onWindowResize.add(_fn)
	.add(function(){document.body.innerHTML += "2"})
	.add(function(){document.body.innerHTML += "3"})
	.remove(_fn);