VS2005+Ajax+WebService Div文本框输入提示
var strHTML = "";
var iCount = 0;
function GetIE(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;
}
var re = {Top:t,Left:l,Width:w,Height:h}
return re;
}
function DoSelect(id,text)
{
//完成选择项
document.getElementById(id).value=text; //返回选项的值给文本框
DeleteTip("TipListBox"); //删除提示窗口
}
function SelectItem(Pos,controlId)
{
//将焦点给指定位置的项
//document.write(strHTML);
var e = document.getElementById("TipListBox_" + controlId + Pos);
//var e = document.getElementByName("TipListBox_"+Pos);
if(e != null) e.focus();
event.returnValue = 0;
}
function SetFocusStyle(refObj)
{
//设置光标所在项的样式
refObj.style.color="#fff";
refObj.style.backgroundColor="#0066CC";
refObj.style.zIndex="150";
}
function SetBlurStyle(refObj)
{
//恢复光标所在项的样式
refObj.style.color="#000";
refObj.style.backgroundColor="";
refObj.style.zIndex="150";
}
function DeleteTip(id)
{
//删除提示窗口
if(document.getElementById(id) != null)
{
document.getElementById(id).removeNode(true);
}
}
//取总数
function CountNum(result)
{
iCount=0;
strHTML="";
iCount=result;
}
//取结果列项
function GetstrHTML(result)
{
strHTML=result;
}
function ShowTip(refObj,bykeyId,flag)
{
DeleteTip("TipListBox"); //删除之前的提示窗口
DeleteTip("Tipiframe");
document.onclick=function()
{
//如果鼠标操作不在当前文本框,则将提示窗口删除
if(event.srcElement.id != refObj.id)
{
DeleteTip("TipListBox");
DeleteTip("Tipiframe");
document.onclick = null;
}
}
//发站的TextBox对象
var strkey="";
if(bykeyId!="")
{
var byKeyObj=document.getElementById(bykeyId);
strkey=byKeyObj.value;
}
var currentPos = -1; //当前选项位置
var str = refObj.value; //当前文本框的值
var eMember = GetIE(refObj);
var eIframe=document.createElement("iframe");
eIframe.id="Tipiframe";
eIframe.style.cssText ="position:absolute;z-index:9;width:"+eMember.Width+"px;height:130px;top:"+(eMember.Top+eMember.Height)+"px;left:"+eMember.Left+"px;" ;
eIframe.frameborder="0";
var eWinElement = document.createElement("div");
eWinElement.id="TipListBox"; //指定提示窗口ID为TipListBox
eWinElement.style.cssText = "position:absolute;z-Index:10;overflow:auto;background-Color:#fff;font-size:12px;border:1px solid #000;left:"+eMember.Left+"px;top:"+(eMember.Top+eMember.Height)+"px;width:"+eMember.Width+"px";
// iCount=0;
// strHTML="";
if(flag<2)
{
WebService.SearchCount(str, flag, CountNum);
WebService.SearchList(str, refObj.id,flag, GetstrHTML);
}
else
{
WebService.EndSearchCount(strkey,str, flag, CountNum);
WebService.EndSearchList(strkey,str, refObj.id,flag, GetstrHTML);
}
if(strHTML == "") return; //如果没有配匹的值则不显示提示窗口
eWinElement.style.height="130px";
eWinElement.style.zIndex ="150";
//document.write(strHTML);
eWinElement.innerHTML =strHTML;
document.body.appendChild(eIframe);
document.body.appendChild(eWinElement);
if(parseInt(eWinElement.offsetHeight)>120)
{
eWinElement.style.height="150px";
eIframe.style.height="150px";
} //定义提示窗口高度
document.onkeydown=function()
{
if(event.keyCode == 40 && currentPos < (iCount-1))
{
//向下的按键操作
SelectItem(++currentPos,refObj.id);
}
if(event.keyCode == 38 && currentPos > 0)
{
//向上的按键操作
SelectItem(--currentPos,refObj.id);
}
if(event.keyCode != 38 && event.keyCode != 40)
{
//其它按钮将当前选项恢复-1的位置
currentPos = -1;
}
}
}
var iCount = 0;
function GetIE(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;
}
var re = {Top:t,Left:l,Width:w,Height:h}
return re;
}
function DoSelect(id,text)
{
//完成选择项
document.getElementById(id).value=text; //返回选项的值给文本框
DeleteTip("TipListBox"); //删除提示窗口
}
function SelectItem(Pos,controlId)
{
//将焦点给指定位置的项
//document.write(strHTML);
var e = document.getElementById("TipListBox_" + controlId + Pos);
//var e = document.getElementByName("TipListBox_"+Pos);
if(e != null) e.focus();
event.returnValue = 0;
}
function SetFocusStyle(refObj)
{
//设置光标所在项的样式
refObj.style.color="#fff";
refObj.style.backgroundColor="#0066CC";
refObj.style.zIndex="150";
}
function SetBlurStyle(refObj)
{
//恢复光标所在项的样式
refObj.style.color="#000";
refObj.style.backgroundColor="";
refObj.style.zIndex="150";
}
function DeleteTip(id)
{
//删除提示窗口
if(document.getElementById(id) != null)
{
document.getElementById(id).removeNode(true);
}
}
//取总数
function CountNum(result)
{
iCount=0;
strHTML="";
iCount=result;
}
//取结果列项
function GetstrHTML(result)
{
strHTML=result;
}
function ShowTip(refObj,bykeyId,flag)
{
DeleteTip("TipListBox"); //删除之前的提示窗口
DeleteTip("Tipiframe");
document.onclick=function()
{
//如果鼠标操作不在当前文本框,则将提示窗口删除
if(event.srcElement.id != refObj.id)
{
DeleteTip("TipListBox");
DeleteTip("Tipiframe");
document.onclick = null;
}
}
//发站的TextBox对象
var strkey="";
if(bykeyId!="")
{
var byKeyObj=document.getElementById(bykeyId);
strkey=byKeyObj.value;
}
var currentPos = -1; //当前选项位置
var str = refObj.value; //当前文本框的值
var eMember = GetIE(refObj);
var eIframe=document.createElement("iframe");
eIframe.id="Tipiframe";
eIframe.style.cssText ="position:absolute;z-index:9;width:"+eMember.Width+"px;height:130px;top:"+(eMember.Top+eMember.Height)+"px;left:"+eMember.Left+"px;" ;
eIframe.frameborder="0";
var eWinElement = document.createElement("div");
eWinElement.id="TipListBox"; //指定提示窗口ID为TipListBox
eWinElement.style.cssText = "position:absolute;z-Index:10;overflow:auto;background-Color:#fff;font-size:12px;border:1px solid #000;left:"+eMember.Left+"px;top:"+(eMember.Top+eMember.Height)+"px;width:"+eMember.Width+"px";
// iCount=0;
// strHTML="";
if(flag<2)
{
WebService.SearchCount(str, flag, CountNum);
WebService.SearchList(str, refObj.id,flag, GetstrHTML);
}
else
{
WebService.EndSearchCount(strkey,str, flag, CountNum);
WebService.EndSearchList(strkey,str, refObj.id,flag, GetstrHTML);
}
if(strHTML == "") return; //如果没有配匹的值则不显示提示窗口
eWinElement.style.height="130px";
eWinElement.style.zIndex ="150";
//document.write(strHTML);
eWinElement.innerHTML =strHTML;
document.body.appendChild(eIframe);
document.body.appendChild(eWinElement);
if(parseInt(eWinElement.offsetHeight)>120)
{
eWinElement.style.height="150px";
eIframe.style.height="150px";
} //定义提示窗口高度
document.onkeydown=function()
{
if(event.keyCode == 40 && currentPos < (iCount-1))
{
//向下的按键操作
SelectItem(++currentPos,refObj.id);
}
if(event.keyCode == 38 && currentPos > 0)
{
//向上的按键操作
SelectItem(--currentPos,refObj.id);
}
if(event.keyCode != 38 && event.keyCode != 40)
{
//其它按钮将当前选项恢复-1的位置
currentPos = -1;
}
}
}