DZone Snippets is a public source code repository. Easily build up your personal collection of code snippets, categorize them with tags / keywords, and share them with the world

Snippets has posted 5883 posts at DZone. View Full User Profile

自定义自动完�

02.22.2006
| 1366 views |
  • submit to reddit
        // description of your code here

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<title>自定义自动完�-51windows.Net</title>
<head>
<meta name="keywords" content="51windows.Net">
<meta http-equiv=Content-Type content="text/html; charset=gb2312">
<style>
.sdiv{font-size:12px;overflow-y:auto;overflow-x:hidden;height:expression(this.parentElement.style.pixelHeight);z-index:101;}
.sdivover{background:highlight;color:highlighttext;width:100%;padding-left:3px;cursor:default;overflow:hidden;hidden;line-height:120%;}
.sdivout {background:#FFFFFF;color:#000000;width:100%;padding-left:3px;cursor:default;overflow:hidden;line-height:120%;}
input{haiwa:expression(this.onkeyup=__ACP);hw:expression(this.ondblclick=__ACP);}
</style>
</head>
<body onclick="divclick()" onkeydown="KeyDown()">
<SCRIPT LANGUAGE="JavaScript">
<!--
var __InputName;
var HighLine = 0
var MenuStrs = ""
var MenuLines = 0
var KeyOnMenu = false
var _AutoObj
var ShowLine = 10
var LineHeight = 15
var SelectValue = "";
var __InputName;
function DivOver(obj){
  if (KeyOnMenu){
    updateHtml(-1);
    KeyOnMenu = false
  }
  obj.className="sdivover";
}

function divclick(obj){
  document.getElementById("__AutocompleteDiv").style.display = "none";
  if (obj){
    selectedvalue = obj.innerText;
    __InputName.value = selectedvalue;
  }
  HighLine = 0
  _Autostr = ""
  SelectValue = ""
}
function __ACP(){
  if (event.keyCode!=13){
    event.cancelBubble=true
    e = this;
    var t=e.offsetTop; 
    var l=e.offsetLeft; 
    var w=e.offsetWidth;
    var h=e.offsetHeight;
    _AutoObj = this
    divID = document.getElementById("__AutocompleteDiv");
    __InputName = this;
    updateHtml(HighLine);
    if (MenuLines>0){
      while(e=e.offsetParent)
      { 
        t+=e.offsetTop; 
        l+=e.offsetLeft; 
      }
      divID = eval(divID);
      divID.style.top = t+h;
      divID.style.left = l;
      divID.style.width = w;
      divID.style.height = MenuLines * LineHeight>ShowLine*LineHeight?ShowLine*LineHeight:MenuLines * LineHeight;
      divID.style.display = ""
    }
    else{
      divID.style.display = "none"
    }
  }
}
function InsertSort(arr) { //�入排�->直接�入法排�@panliu888
  var temp, j;
  for(var i=1; i<arr.length; i++) {
    if((arr[i]) < (arr[i-1])) {
      temp = arr[i];
      j = i-1;
      do {
        arr[j+1] = arr[j];
        j--;
      }
      while (j>-1 && (temp) < (arr[j]));
      arr[j+1] = temp;
    }//endif
  }
  return arr;
}
function updateHtml(k){
   listhtml = ""
  var line = 0
  htmlarr = InsertSort(_AutoObj.autolist.split("|"))
  var liststrarr = htmlarr;
  for(i=0;i<liststrarr.length;i++){
    if((liststrarr[i].substr(0,_AutoObj.value.length)==_AutoObj.value)&&(liststrarr[i].length>_AutoObj.value.length)){
      line ++;
      if (k==line){
        SelectValue = liststrarr[i]
        listhtml += '<div class="sdivover" onclick="divclick(this)" onmouseover=DivOver(this);HighLine='+line+';SelectValue="'+liststrarr[i].replace(/\"/ig,"\\"")+'"; onmouseout=this.className="sdivout";>'+liststrarr[i]+'</div>';
      }
      else
        listhtml += '<div class="sdivout" onclick="divclick(this)" onmouseover=DivOver(this);HighLine='+line+';;SelectValue="'+liststrarr[i].replace(/\"/ig,"\\"")+'"; onmouseout=this.className="sdivout";>'+liststrarr[i]+'</div>';
    }
  }
  MenuLines = line
  document.getElementById("__AutocompleteDivlist").innerHTML = listhtml;
  document.getElementById("__AutocompleteDivlist").scrollTop = (k-ShowLine)>0?(k-ShowLine)*LineHeight:0;
}
function KeyDown(){
  switch ( event.keyCode ){
    case 13 : if(SelectValue.length>0){_AutoObj.value =SelectValue;divclick();}break ;
    case 38 : KeyMove(-1) ;  break ;
    case 40 : KeyMove(1) ;  break ;
  }
}
function KeyMove(n){
  HighLine = HighLine+(n);
  if (parseInt(HighLine)>parseInt(MenuLines)){HighLine = 1;}
  if(parseInt(HighLine)<1){HighLine = MenuLines;}
  KeyOnMenu = true;
  updateHtml(HighLine)
}
//-->
</SCRIPT>
昵称:<input type="text" autolist="51windows|"|haiwa|blueidea|hw|google|jimao8|中国|中|海娃|�海�" size="40" name="q"><br>
网�:<input type="text" autolist="http://www.51windows.Net|http://www.blueidea.com|http://www.csdn.Net" size="40" name="q">

<div id="__AutocompleteDiv" style="position: absolute;border: 1 solid #000000;display:none;height:180px;background:#FFFFFF;" onclick="event.cancelBubble=true">
<div class="sdiv" id="__AutocompleteDivlist" onclick="event.cancelBubble=true">
</div>
</div>
</body>
</html>