/**
 * @author wsj
 * 
 */

//使用说明：只要在页面上放置一个 <div id="wsjAutoDiv" target="目标" lazy="1000"></div>
//参数说明：target -- 要自动完成的目标 元素ID(必须) lazy---延迟加载 单位毫秒 可以不填（默认为2秒） 
 
/*JS 入口 
 * 说明: 返回结果以JSON的格式 属性名为 key 的JSON数组 
 *function wsjGetValue()
 *{
	var xx=[{"key":"abc"},{"key":"cba"}];
	return xx;
 *} 
 */

			//在目标元素的 onkeyup 做关联 
			function wsjAuto()
			{
				var autoDiv=document.getElementById("wsjAutoDiv");
				var tmp_lazy=autoDiv.getAttribute("lazy");//延迟时间 
				if(tmp_lazy==null)//未填延迟，默认2秒 
					{
						tmp_lazy=2000;
						alert(tmp_lazy);
					}
				setTimeout(function(){wsjInitDiv(autoDiv)},tmp_lazy);
			}
			
			//初始化层 
			function wsjInitDiv(autoDiv)
			{
				var mb_txt=autoDiv.getAttribute("target");//目标 
				var mb= document.getElementById(mb_txt);		
				mb.onblur=function(){autoDiv.style.display="none";}
				
				autoDiv.style.left=mb.offsetLeft+"px";
				autoDiv.style.top=mb.offsetTop+mb.offsetHeight+"px";
				autoDiv.style.width=mb.offsetWidth-2+"px";
				//autoDiv.style.height=mb.offsetHeight+"px";
				autoDiv.style.position="absolute";
				autoDiv.style.zIndex="1";
				autoDiv.style.border="1px solid black";
				autoDiv.style.background="white";
				autoDiv.style.display="none";
				
				var ajaxValue=wsjGetValue();
				if(ajaxValue.length==0)
					return ;
				else
					wsjSetValue(ajaxValue,autoDiv);
			}
						
			//处理数据 
			function wsjSetValue(val,autoDiv)
			{
				var htmlUi="<ul style='list-type:none;margin:0px;padding:0px'>";
				var i;
				for(i=0;i<val.length;i++)
				{
					htmlUi+="<li style='display:block;cursor:pointer;text-align:left' onclick=\"wsjLiClk(this,'wsjAutoDiv');\" onmouseover=\"wsjLiMouseOver(this,'wsjAutoDiv');\" onmouseout=\"wsjLiMouseOut(this,'wsjAutoDiv');\">";
					htmlUi+=val[i].key;
					htmlUi+="</li>";
				}
				htmlUi+="</ul>";
				autoDiv.innerHTML=htmlUi;
				autoDiv.style.display="";
			}
			
			//---列表事件组---
			function wsjLiClk(liObj,autoDiv_txt)//单击事件 
			{
				var autoDiv= document.getElementById(autoDiv_txt);
				var mb=document.getElementById(autoDiv.getAttribute("target"));//获得目标对象 
				mb.value=liObj.innerHTML;
				autoDiv.style.display="none";
			}
			
			function wsjLiMouseOver(liObj,autoDiv_txt)//鼠标滑入事件 
			{
				liObj.style.background="#569cde";
				var autoDiv= document.getElementById(autoDiv_txt);
				var mb=document.getElementById(autoDiv.getAttribute("target"));
				mb.onblur=null;//取消事件 
			}
			
			function wsjLiMouseOut(liOjb,autoDiv_txt)//鼠标滑出事件 
			{
				liOjb.style.background="";
				var autoDiv= document.getElementById(autoDiv_txt);
				var mb=document.getElementById(autoDiv.getAttribute("target"));
				mb.onblur=function(){autoDiv.style.display="none";}//注册事件 
			}
			//---列表事件组结束---