dhcombobox.js

大型豪华网络游戏交易平台!!有喜欢的就的就快哦~~~~~~

function dhCombobox(){

	var dh = this;
	this.callbackName = null;
	this.datasource = [];
	this.trgetObj = null;
	this.w = 250;
	this.h = 150;

	var tempArr = [];
	var totalL = 0;
	var startL = 0;
	var endL = 0;
	
	//匹配用户输入字符结果
	Array.prototype.contains = function(o){
		var tc = [];
		for(var	i=0,l=this.length;i<l;i++){
			if(-1 != this[i].toString().indexOf(o)){
				tc.push(this[i]);
			}
		}
		return tc
	}

	function ats(o,s,e){
		return "<a href=\"javascript:void(0);\" onclick=\"return "+dh.callbackName+".ac(this);\">"+o.slice(s,e).join("</a><a href=\"javascript:void(0);\" onclick=\"return "+dh.callbackName+".ac(this);\">")+"</a>";
	}

	function getElementpos(e){
		var t = e.offsetTop;
		var l = e.offsetLeft;
		var w = e.offsetWidth;
		var h = e.offsetHeight;
		while(e=e.offsetParent){
			t += e.offsetTop;
			l += e.offsetLeft;
		}
		t += h;
		return {top: t,left: l,width: w,height: h}
	}

	var dhPopMenu;

	function showPop(str){
		if(dh.targetObj!=null){
			var posi = getElementpos(dh.targetObj);
			//应用dhLayer类作为结果集容器
			dhPopMenu = new dhlayer();
			dhPopMenu.border = "1px solid #808080";
			dhPopMenu.background = "lightyellow";
			dhPopMenu.padding = "0px";
			dhPopMenu.content = str;
			dhPopMenu.show(posi.left,posi.top,dh.w,dh.h,document.body);
			dhPopMenu.body.onscroll = function(){showmore();dh.targetObj.focus();}
			dhPopMenu.body.onmouseup = function(){dh.targetObj.focus();}
		}
	}

	var selectedoption = 0;

	var oldvalue = null;

	//choose the result use mouse
	this.ac = function(o){
		if(this.targetObj!=null){
			oldvalue = this.targetObj.value = o.innerHTML;
		}
		dh.selectedoption = 0;
		return false;
	}

	//匹配
	function searchKey(e){
		if(e!=13 && e!=38 && e!=40 && e!=37 && e!=39){
			var str	= dh.targetObj.value;
			if(str!=oldvalue){
				if(str.replace(/\s/g,"") != ""){
					tempArr = dh.datasource.contains(str);
					totalL = tempArr.length;
					startL = 0;
					if(100<totalL){
						endL = 100;
					}else{
						endL = totalL;
					}
					showPop(ats(tempArr,startL,endL));
					selectedoption = 0;
				}
				oldvalue = str;
			}
			if(typeof dhPopMenu=="object" && dhPopMenu.childNodes[selectedoption]){
				dhPopMenu.childNodes[selectedoption].style.border = "1px dotted #630";
				dhPopMenu.childNodes[selectedoption].style.color = "red";
			}
		}
	}

	//追加数据
	function showmore(){
		if(endL<totalL){
			if(typeof dhPopMenu=="object"){
				var ch = dhPopMenu.body.scrollHeight;
				var sh = dhPopMenu.body.scrollTop;
				if(ch-sh<=dh.h){
					startL = endL;
					if(100<totalL-endL){
						endL += 100;
					}else{
						endL += totalL-endL;
					}
					if(document.all){
						dhPopMenu.body.insertAdjacentHTML("beforeEnd",ats(tempArr,startL,endL))
					}else{
						dhPopMenu.body.innerHTML += ats(tempArr,startL,endL);
					}
				}
			}
		}
	}

	function pressKey(e){
		switch(e){
			case 13:
				if(typeof dhPopMenu=="object" && dhPopMenu.childNodes[selectedoption]){
					if(dh.targetObj!=null){
						oldvalue = dh.targetObj.value = dhPopMenu.childNodes[selectedoption].innerHTML;
					}
					dhPopMenu.hide();
					selectedoption = 0;
					return false;
				}
				break;
			case 38:
				if(typeof dhPopMenu=="object"){
					if(0<selectedoption){
						dhPopMenu.childNodes[selectedoption].style.border = "none";
						dhPopMenu.childNodes[selectedoption].style.color = "";
						selectedoption--;
						dhPopMenu.childNodes[selectedoption].style.border = "1px dotted #630";
						dhPopMenu.childNodes[selectedoption].style.color = "red";
						dhPopMenu.childNodes[selectedoption].scrollIntoView();
					}
				}
				break;
			case 40:
				if(typeof dhPopMenu=="object"){
					if(dhPopMenu.childNodes.length>1 && selectedoption<dhPopMenu.childNodes.length-1){
						dhPopMenu.childNodes[selectedoption].style.border = "none";
						dhPopMenu.childNodes[selectedoption].style.color = "";
					}
					if(selectedoption<dhPopMenu.childNodes.length-1){
						selectedoption++;
						dhPopMenu.childNodes[selectedoption].style.border = "1px dotted #630";
						dhPopMenu.childNodes[selectedoption].style.color = "red";
						dhPopMenu.childNodes[selectedoption].scrollIntoView();
					}
				}
				break;
			default:break;
		}
	}

	this.setup = function(){
		var targetObj = this.targetObj;
		if(targetObj!=null){
			targetObj.onkeydown = function(e){e=e || window.event; e=e.which || e.keyCode;pressKey(e);}
			targetObj.onkeyup = function(e){e=e || window.event; e=e.which || e.keyCode;searchKey(e);}
		}
	}
}