JS文件-----------
var intIndex = 0;
var intMouseX;
var intMouseY;
var intDivShowFlag = 0;
var intTextShowFlag = 0;function InitSmartPromptList(arrList)
{
if (arrList.constructor != Array)
{
return;
} arrList.sort
(
function(a, b)
{
if(a.length>b.length)
{
return 1;
}
else if(a.length==b.length)
{
return a.localeCompare(b);
}
else
{
return -1;
}
}
);
}
function SmartPromptList(arrList, objInputId)
{
var objouter = document.getElementById("__SmartDiv"); //Div
var objInput = document.getElementById(objInputId); //TextBox
var selectedIndex = -1;
var intTmp; //Temp variant to do loop... if (objInput==null)
{
return;
} //textbox lost focus
objInput.onblur =
function()
{
if(IsInRect() == false)
{
objouter.style.display = 'none';
}
};
//Div lost focus
objouter.onblur =
function()
{
if(IsInRect() == false)
{
objouter.style.display = 'none';
}
}; function IsInRect()
{
intRectX_Min = objouter.offsetLeft;
intRectX_Max = objouter.offsetLeft + objInput.clientWidth;
intRectY_Min = objInput.offsetTop;
intRectY_Max = objInput.offsetTop + objInput.clientHeight + 300; if(
intMouseX >= intRectX_Min &&
intMouseX <= intRectX_Max &&
intMouseY >= intRectY_Min &&
intMouseY <= intRectY_Max
)
{
return true;
}
else
{
return false;
}
} //Key in some text in textbox
objInput.onkeyup = checkKeyCode;
//TextBox gets focus
objInput.onfocus = checkAndShow; function checkKeyCode()
{
var ie = (document.all)? true:false;
if (ie)
{
var keyCode = event.keyCode; if (keyCode==40||keyCode==38)
{
//[Up] or [Down]
var isUp = false;
if(keyCode==40)
{
isUp=true;
} changeSelection(isUp);
}
else if (keyCode==13)
{
//[Enter]
outSelection(selectedIndex);
}
else
{
checkAndShow();
}
}
else
{
checkAndShow();
}
divPosition();
} function checkAndShow()
{
var strInput = objInput.value;
divPosition();
selectedIndex = -1;
objouter.innerHTML = "";
for (intTmp=0;intTmp<arrList.length;intTmp++)
{
if (arrList[intTmp].substr(0, strInput.length).toUpperCase() == strInput.toUpperCase())
{
addOption(arrList[intTmp]);
}
}
objouter.style.display='';
function addOption(value)
{
objouter.innerHTML += "<div onmouseover=\"this.className='SmartDiv_SelectedStyle'\" onmouseout=\"this.className='';\" onmousedown=\"document.getElementById('"+objInputId+"').value='" + value + "';document.getElementById('__SmartDiv').style.display='none';\">" + value + "</div>";
}
} function changeSelection(isUp)
{
if (objouter.style.display == 'none')
{
objouter.style.display='';
}
else
{
if (isUp)
{
selectedIndex++;
}
else
{
selectedIndex--;
}
}
var maxIndex = objouter.children.length - 1;
if (selectedIndex < 0)
{
selectedIndex = 0;
}
if (selectedIndex>maxIndex)
{
selectedIndex = maxIndex;
}
for (intTmp=0; intTmp <= maxIndex; intTmp++)
{
if (intTmp == selectedIndex)
{
objouter.children[intTmp].className = "SmartDiv_SelectedStyle";
}
else
{
objouter.children[intTmp].className = "";
}
}
} function outSelection(Index)
{
objInput.value = objouter.children[Index].innerText;
objouter.style.display = 'none';
} function divPosition()
{
objouter.style.top = getAbsoluteHeight(objInput)+getAbsoluteTop(objInput);
objouter.style.left = getAbsoluteLeft(objInput);
objouter.style.width = getAbsoluteWidth(objInput);
}
} document.write("<div id='__SmartDiv' style='position:absolute;display:none;background:#E6E6FA;border: 1px solid #CCCCCC;font-size:14px;cursor: default;height:300px;overflow:auto;'> </div>");
document.write("<style>.SmartDiv_SelectedStyle{background-Color:#102681;color:#FFFFFF}</style>"); function getAbsoluteHeight(ob)
{
return ob.offsetHeight;
}
function getAbsoluteWidth(ob)
{
return ob.offsetWidth;
}
function getAbsoluteLeft(ob)
{
var mendingLeft = ob .offsetLeft;
while( ob != null && ob.offsetParent != null && ob.offsetParent.tagName != "BODY" )
{
mendingLeft += ob.offsetParent.offsetLeft;
ob = ob.offsetParent;
} return mendingLeft ;
}
function getAbsoluteTop(ob)
{
var mendingTop = ob.offsetTop;
while( ob != null && ob.offsetParent != null && ob.offsetParent.tagName != "BODY" )
{
mendingTop += ob .offsetParent.offsetTop;
ob = ob.offsetParent;
} return mendingTop ;
} function onMouseMove()
{
try
{
intMouseX = event.clientX + document.body.scrollLeft - document.body.clientLeft;
intMouseY = event.clientY + document.body.scrollTop - document.body.clientTop;
}
catch(e)
{
}
} document.onmousemove = onMouseMove;
----------
ASPX里面:
var pArray= new Array(); ...自己加Array内容
intIndex = pArray.length;
InitSmartPromptList(pArray);
SmartPromptList(pArray, 文本框的客户端ID);
var intIndex = 0;
var intMouseX;
var intMouseY;
var intDivShowFlag = 0;
var intTextShowFlag = 0;function InitSmartPromptList(arrList)
{
if (arrList.constructor != Array)
{
return;
} arrList.sort
(
function(a, b)
{
if(a.length>b.length)
{
return 1;
}
else if(a.length==b.length)
{
return a.localeCompare(b);
}
else
{
return -1;
}
}
);
}
function SmartPromptList(arrList, objInputId)
{
var objouter = document.getElementById("__SmartDiv"); //Div
var objInput = document.getElementById(objInputId); //TextBox
var selectedIndex = -1;
var intTmp; //Temp variant to do loop... if (objInput==null)
{
return;
} //textbox lost focus
objInput.onblur =
function()
{
if(IsInRect() == false)
{
objouter.style.display = 'none';
}
};
//Div lost focus
objouter.onblur =
function()
{
if(IsInRect() == false)
{
objouter.style.display = 'none';
}
}; function IsInRect()
{
intRectX_Min = objouter.offsetLeft;
intRectX_Max = objouter.offsetLeft + objInput.clientWidth;
intRectY_Min = objInput.offsetTop;
intRectY_Max = objInput.offsetTop + objInput.clientHeight + 300; if(
intMouseX >= intRectX_Min &&
intMouseX <= intRectX_Max &&
intMouseY >= intRectY_Min &&
intMouseY <= intRectY_Max
)
{
return true;
}
else
{
return false;
}
} //Key in some text in textbox
objInput.onkeyup = checkKeyCode;
//TextBox gets focus
objInput.onfocus = checkAndShow; function checkKeyCode()
{
var ie = (document.all)? true:false;
if (ie)
{
var keyCode = event.keyCode; if (keyCode==40||keyCode==38)
{
//[Up] or [Down]
var isUp = false;
if(keyCode==40)
{
isUp=true;
} changeSelection(isUp);
}
else if (keyCode==13)
{
//[Enter]
outSelection(selectedIndex);
}
else
{
checkAndShow();
}
}
else
{
checkAndShow();
}
divPosition();
} function checkAndShow()
{
var strInput = objInput.value;
divPosition();
selectedIndex = -1;
objouter.innerHTML = "";
for (intTmp=0;intTmp<arrList.length;intTmp++)
{
if (arrList[intTmp].substr(0, strInput.length).toUpperCase() == strInput.toUpperCase())
{
addOption(arrList[intTmp]);
}
}
objouter.style.display='';
function addOption(value)
{
objouter.innerHTML += "<div onmouseover=\"this.className='SmartDiv_SelectedStyle'\" onmouseout=\"this.className='';\" onmousedown=\"document.getElementById('"+objInputId+"').value='" + value + "';document.getElementById('__SmartDiv').style.display='none';\">" + value + "</div>";
}
} function changeSelection(isUp)
{
if (objouter.style.display == 'none')
{
objouter.style.display='';
}
else
{
if (isUp)
{
selectedIndex++;
}
else
{
selectedIndex--;
}
}
var maxIndex = objouter.children.length - 1;
if (selectedIndex < 0)
{
selectedIndex = 0;
}
if (selectedIndex>maxIndex)
{
selectedIndex = maxIndex;
}
for (intTmp=0; intTmp <= maxIndex; intTmp++)
{
if (intTmp == selectedIndex)
{
objouter.children[intTmp].className = "SmartDiv_SelectedStyle";
}
else
{
objouter.children[intTmp].className = "";
}
}
} function outSelection(Index)
{
objInput.value = objouter.children[Index].innerText;
objouter.style.display = 'none';
} function divPosition()
{
objouter.style.top = getAbsoluteHeight(objInput)+getAbsoluteTop(objInput);
objouter.style.left = getAbsoluteLeft(objInput);
objouter.style.width = getAbsoluteWidth(objInput);
}
} document.write("<div id='__SmartDiv' style='position:absolute;display:none;background:#E6E6FA;border: 1px solid #CCCCCC;font-size:14px;cursor: default;height:300px;overflow:auto;'> </div>");
document.write("<style>.SmartDiv_SelectedStyle{background-Color:#102681;color:#FFFFFF}</style>"); function getAbsoluteHeight(ob)
{
return ob.offsetHeight;
}
function getAbsoluteWidth(ob)
{
return ob.offsetWidth;
}
function getAbsoluteLeft(ob)
{
var mendingLeft = ob .offsetLeft;
while( ob != null && ob.offsetParent != null && ob.offsetParent.tagName != "BODY" )
{
mendingLeft += ob.offsetParent.offsetLeft;
ob = ob.offsetParent;
} return mendingLeft ;
}
function getAbsoluteTop(ob)
{
var mendingTop = ob.offsetTop;
while( ob != null && ob.offsetParent != null && ob.offsetParent.tagName != "BODY" )
{
mendingTop += ob .offsetParent.offsetTop;
ob = ob.offsetParent;
} return mendingTop ;
} function onMouseMove()
{
try
{
intMouseX = event.clientX + document.body.scrollLeft - document.body.clientLeft;
intMouseY = event.clientY + document.body.scrollTop - document.body.clientTop;
}
catch(e)
{
}
} document.onmousemove = onMouseMove;
----------
ASPX里面:
var pArray= new Array(); ...自己加Array内容
intIndex = pArray.length;
InitSmartPromptList(pArray);
SmartPromptList(pArray, 文本框的客户端ID);
解决方案 »
免费领取超大流量手机卡,每月29元包185G流量+100分钟通话, 中国电信官方发货