潘魏增

在《Javascript实现命名空间》这篇文章中提到了区块化编码，这里提供一个完整的示例。示例的代码是用于资讯首页提供网页快照功能的入口，不像日历、TabControl这种通用组件有现成的代码，所以需要自己写一个。代码名字就叫lookBack。lookBack是一个函数，然后使用prototype定义了一些原型成员，在同一个页面中可以使用lookBack的多个实例。由于原有开发包中监听事件的函数好像对onchange事件捕捉不到，所以这里单独把事件监听写入到lookBack中。主要代码是三个函数类型的原型成员，它们之间使用this引用，代码如下。

appendOption:function(node,nodeChildren,text,selectedIndex){
	node.options.length = 0;//先将节点的选项清空
	var childNode = null;
	if(nodeChildren.constructor == Array){
		for(var i in nodeChildren){
			childNode = document.createElement("OPTION");
			childNode.value = nodeChildren[i];
			childNode.text  = nodeChildren[i] + text;
			node.options.add(childNode);
		}
	}
	else {
		for(i = 1; i <= nodeChildren; i++){
			childNode = document.createElement("OPTION");
			childNode.value = i;
			childNode.text  = i + text;
			node.options.add(childNode);
		}
	}
	node.options.selectedIndex = selectedIndex;
},
attachEvent:function(el,type,fn,range){
	if (el.addEventListener)
		el.addEventListener(type,function(){fn.apply(range)}, false);
	else
		el.attachEvent("on"+type, function(){fn.apply(range)});
},
init:function(){
	this.appendOption($(this.yearHandler),[2006,2007,2008],this.yearText,2);
	this.appendOption($(this.monthHandler),
		12,
		this.monthText,
		this.currentTime.getMonth()
	);
	this.appendOption($(this.dayHandler),
		parseInt(this.dayArray[this.currentTime.getMonth()]),
		this.dayText,
		this.currentTime.getDate()-1
	);
	this.appendOption($(this.hourHandler),[10,22],this.hourText,0);
	this.attachEvent($(this.yearHandler),'change',this.yearOnChange,this);
	this.attachEvent($(this.monthHandler),'change',this.monthOnChange,this);
	this.attachEvent($(this.triggerHandler),'click',this.redirect,this);
}

完整代码地址http://panweizeng.com/images/javascript/code_lookBack.js