<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type='text/javascript' src='/dwr/interface/jsuser.js'></script>??
<script type='text/javascript' src='/dwr/engine.js'></script>??
<script type='text/javascript' src='/dwr/util.js'></script>??
<script>
function smanPrompt(obj){
var objouter = document.getElementById("__smanDisp") //顯示的DIV對象
var objInput = document.getElementById(obj.id); //文本框對象
var selectedIndex = -1;
var intTmp; //循環用的
//文本框失去焦點
objInput.onblur = function()
{
?objouter.style.display = 'none';
}
window.onfocus = function(){
?objouter.style.display = 'none';
}
//文本框按鍵抬起
objInput.onkeyup = checkKeyCode;
//文本框得到焦點
objInput.onfocus = checkAndShow;
function checkKeyCode()
{
?var ie = (document.all) ? true : false
?if (ie)
?{
??var keyCode = event.keyCode
??if (keyCode == 40 || keyCode == 38)
??{ //下上
???var isUp = false
???if (keyCode == 40)
????isUp = true;
???chageSelection(isUp)
??}
??else
???if (keyCode == 13)
???{//回車
????outSelection(selectedIndex);
???}
???else
???{
????checkAndShow()
???}
?}
?else
?{
??checkAndShow()
?}
?divPosition()
}
function checkAndShow()
{
?var strInput = objInput.value
?if (strInput != "") {
??divPosition();
??objouter.innerHTML = "";
??bOnClick();
?}
?else {
??objouter.style.display = 'none';
?}

?function bOnClick()??
?{??
???jsuser.getKeyHTMl(strInput,callback);?
?}??
?function callback(msg)??
?{??
??objouter.innerHTML = msg;
??if(msg=="")
??{
???objouter.style.display = 'none';
??}else
??{
???objouter.style.display = '';
??}
?}??
??
}
function chageSelection(isUp){
?if (objouter.style.display == 'none'&& objInput.value !="" && objouter.innerHTML!="")
?{
??objouter.style.display = '';
?}
?else {
??if (isUp)
???selectedIndex++
??else
???selectedIndex--
?}
?var maxIndex = objouter.children.length - 1;
?if (selectedIndex < 0) {
??selectedIndex = -1
?}
?if (selectedIndex > maxIndex) {
??selectedIndex = 0
?}
?for (intTmp = 0; intTmp <= maxIndex; intTmp++) {
??if (intTmp == selectedIndex) {
???objouter.children[intTmp].className = "sman_selectedStyle";
??}
??else {
???objouter.children[intTmp].className = "";
??}
?}
}
function outSelection(Index){
?if (!objouter.children[Index])
??return;
?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)
}

function getAbsoluteHeight(ob)
{
?return ob.offsetHeight
}
function getAbsoluteWidth(ob)
{
?return ob.offsetWidth
}
function getAbsoluteLeft(ob)
{
?var s_el = 0;
?el = ob;
?while (el) {
??s_el = s_el + el.offsetLeft;
??el = el.offsetParent;
?};
?return s_el
}
function getAbsoluteTop(ob)
{
?var s_el = 0;
?el = ob;
?while (el) {
??s_el = s_el + el.offsetTop;
??el = el.offsetParent;
?};
?return s_el
}
}

</script>
<style>
.inp {border: 1px solid #999;padding: 0px 0 0 2px;height: 23px;line-height: 23px;font-size: 14px;color: #666}
.inp.sffocus {background: #fff;border: 1px solid #f90;color: blue;}
.sman_selectedStyle{background-Color:#102681;color:#FFFFFF}
</style>
<input name="textinput" onfocus="smanPrompt(this)"? tabindex="1" type="text" size="45" class="inp" value="" id="inputer" />
<div id="__smanDisp" style="position:absolute;display:none;background:#E8F7EB;border: 1px solid #CCCCCC;font-size:14px;cursor: default;onbulr"> </div>



?public String getKeyHTMl(String key)
??? {
??? ?//System.out.println(key);
??? ?String temp = "";
??? ?Pattern p = Pattern.compile("^("+key+")");//<[^>]+>
??? ?Matcher m = null;
??? ?for(int i=0; i<keyarry.length; i++)
??? ?{
??? ?? m = p.matcher(keyarry[i]);
??? ??if(m.find())
??? ??{
??? ???temp = temp + "<div onmouseover=\"this.className='sman_selectedStyle'\" " +
????"onmouseout=\"this.className=''\" " +
????"onmousedown=\"document.getElementById('inputer').value='" + keyarry[i] + "';window.focus();\">" + keyarry[i].replace(key, "<font color=red>"+key+"</font>") + "</div>";
??? ??}
??? ?}
??? ?return temp;
??? }