autoComplete=function(fID,ajaxScript){

	this.id=document.getElementById(fID);
	this.script=ajaxScript;

	if (!this.id) return false;

	//存放建議清單的div識別名稱
	this.div		='_sg';
	//建議清單樣式名稱
	this.className		='_sgClass';
	this.suggest		='_qg';
	//body設的margin,用來補足IE偏移
	this.marginTop		=1;
	this.marginLeft		=0;
	//建議清單寬度
	this.divWidth		='230px';
	//建議清單顯示列數
	this.selectHeight	=10;

	//建立XMLHttpRequest物件
	this.xmlHttp		=this.createXHR();

	//保存 this 不變化
	var pointer = this;

	this.id.onkeyup = function(e){ return pointer.onKeyUp(e); }
}

autoComplete.prototype.onKeyUp=function(e){
	var key = (window.event) ? window.event.keyCode : e.which;

	switch(key){
		case 13:	//return
			break;
		case 8:		//backspace
			break;
		case 9:		//tab
			break;	//do nothing
		case 27:	//esc
			this.submits();
			this.id.value='';
			break;
		case 38:	//up
			break;
		case 40:	//down
			break;
		default:
			this.getRequest();
	}
}

autoComplete.prototype.getRequest=function(){
	var url=this.script+'?s='+this.id.value+'&ts='+new Date().getTime();
	this.sendRequest(url);
}

autoComplete.prototype.createLayer=function(){

	var divName=this.div;
	var sName=this.suggest;
	var obj=this.id;
	var body=document.getElementsByTagName("body")[0];

	//create layer
	if (document.getElementById(divName)==null){
		var div=document.createElement('div');
		div.setAttribute('id',divName);
		div.style.position='absolute';
		div.style.width=obj.offsetWidth+'px';

		var pos=this.getPos(this.id);
		div.style.left=pos.x+'px';
		div.style.top=(pos.y+obj.offsetHeight)+'px';

		body.appendChild(div);
	}
}

autoComplete.prototype.getPos=function(d){
	var cx=0,cy=0,obj;
	obj=d;

	if (obj.offsetParent){
		while (obj.offsetParent){
			cx += obj.offsetLeft;
			obj = obj.offsetParent;
		}
	}else if(obj.x){
		cx+=obj.x;
	}

	obj=d;

	if (obj.offsetParent){
		while (obj.offsetParent){
			cy += obj.offsetTop;
			obj = obj.offsetParent;
		}
	}else if(obj.y){
		cy+=obj.y;

	}

	//IE 補回 body 的 margin
	var b=navigator.userAgent;
	var ie=(b.indexOf('MSIE')!=-1);
	var opera=(b.indexOf('Opera')!=-1);
	var mozilla=(b.indexOf('Mozilla')!=-1);
	if (ie){
		return {x:cx+this.marginLeft, y:cy+this.marginTop}
	}else{
		return {x:cx, y:cy}
	}
}

autoComplete.prototype.showSuggest=function(va){
	var obj=document.getElementById(this.div);

	var selectobj=document.createElement("select");

	for (var i=0;i<va.length;i++){
		var op=document.createElement("option");
		var sText=document.createTextNode(va[i][1]);
		op.appendChild(sText);
		op.setAttribute('value',va[i][1]);
		selectobj.appendChild(op);
	}

	selectobj.setAttribute('id',this.suggest);
	selectobj.setAttribute('size',this.selectHeight);
	selectobj.style.width=this.divWidth;
	selectobj.className=this.className;

	//判斷是否已經有建議名單
	if (document.getElementById(this.suggest)){
		obj.replaceChild(selectobj,document.getElementById(this.suggest));
	}else{
		obj.appendChild(selectobj);
	}

	var pointer=this;
	selectobj.onchange=function(){
		pointer.submits();
		}
	selectobj.ondblclick=function(){
		pointer.submits();
		}
}

autoComplete.prototype.submits=function(){
	var v=document.getElementById(this.suggest).value;
	this.id.value=v;
	var body=document.getElementsByTagName("body")[0];
	body.removeChild(document.getElementById(this.div));
}

autoComplete.prototype.createXHR=function(){
	var xmlHttp;
	if (window.XMLHttpRequest) {
		xmlHttp = new XMLHttpRequest();
	}else if (window.ActiveXObject) {
		xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
	}

	if (!xmlHttp) {
		alert('您使用的瀏覽器不支援 XMLHTTP 物件');
		return false;
	}else{
		return xmlHttp;
	}
}

autoComplete.prototype.sendRequest=function(url){
	var pointer=this;

	this.xmlHttp.open('GET',url,true);
	this.xmlHttp.onreadystatechange=function(){pointer.catchXML()};
	this.xmlHttp.send(null);
}

autoComplete.prototype.catchXML=function(){
	if (this.xmlHttp.readyState==4){
		xml=this.xmlHttp.responseXML;
		if (this.xmlHttp.status == 200) {
			this.createLayer();
    			this.showSuggest(getNodeContent(xml));
		}else{
			alert(this.xmlHttp.status);
		}
	}
}