模仿IE自动完成功能 2022-07-15 80酷酷网 80kuku.com 模仿IE自动完成功能，支持Firefox.支持方向键操作运行代码框<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><HTML><HEAD><TITLE> New Document </TITLE><META NAME="Generator" CONTENT="EditPlus"><META NAME="Author" CONTENT=""><META NAME="Keywords" CONTENT=""><META NAME="Description" CONTENT=""><style>body,div {font-family:verdana;line-height:100%;font-size:9pt;}input {width:300px;}h1 {text-align:center;font-size:2.2em;}#divf {margin:10px;font-size:0.8em;text-align:center;}#divc {border:1px solid #333333;}.des {width:500px;background-color:lightyellow;border:1px solid #333;padding:20px;margin-top:20px;}.mouseover {color:#ffffff;background-color:highlight;width:100%;cursor:default;}.mouseout {color:#000000;width:100%;background-color:#ffffff;cursor:default;}</style><SCRIPT LANGUAGE="JavaScript"><!--// script by blueDestiny// email : blueDestiny [at] 126 . com// Object: jsAuto// browser: ie, mf.// example:// step1 : // create autocomplete container, return object and bind event to the object, and ///create a new jsAuto instance:// <div id="divautocomplete"></div>// var autocomplete = new jsAuto("autocomplete","divautocomplete")// handle event:// autocomplete.handleEvent(value, returnObjectID)// <input id="rautocomplete" onkeyup="autocomplete.handleEvent(this.value,"ratocomplete",event)>// step2 :// add autocompete item:// autocomplete.item(string)// string must be a string var, you can split the string by ","// autocomplete.item("blueDestiny,never-online,csdn,blueidea")// http://www.never-online.comfunction jsAuto(instanceName,objID){this._msg = [];this._x = null;this._o = document.getElementById( objID );if (!this._o) return;this._f = null;this._i = instanceName;this._r = null;this._c = 0;this._s = false;this._v = null;this._o.style.visibility = "hidden";this._o.style.position = "absolute";this._o.style.zIndex = "9999";this._o.style.overflow = "auto";this._o.style.height = "50";return this;};jsAuto.prototype.directionKey=function() { with (this){var e = _e.keyCode ? _e.keyCode : _e.which;var l = _o.childNodes.length;(_c>l-1 || _c<0) ? _s=false : "";if( e==40 && _s ){_o.childNodes[_c].className="mouseout";(_c >= l-1) ? _c=0 : _c ++;_o.childNodes[_c].className="mouseover";}if( e==38 && _s ){_o.childNodes[_c].className="mouseout";_c--<=0 ? _c = _o.childNodes.length-1 : "";_o.childNodes[_c].className="mouseover";}if( e==13 ){if(_o.childNodes[_c] && _o.style.visibility=="visible"){_r.value = _x[_c];_o.style.visibility = "hidden";}}if( !_s ){_c = 0;_o.childNodes[_c].className="mouseover";_s = true;}}};// mouseEvent.jsAuto.prototype.domouseover=function(obj) { with (this){_o.childNodes[_c].className = "mouseout";_c = 0;obj.tagName=="DIV" ? obj.className="mouseover" : obj.parentElement.className="mouseover";}};jsAuto.prototype.domouseout=function(obj){obj.tagName=="DIV" ? obj.className="mouseout" : obj.parentElement.className="mouseout";};jsAuto.prototype.doclick=function(msg) { with (this){if(_r){_r.value = msg;_o.style.visibility = "hidden";}else{alert("javascript autocomplete ERROR :\n\n can not get return object.");return;}}};// object method;jsAuto.prototype.item=function(msg){if( msg.indexOf(",")>0 ){var arrMsg=msg.split(",");for(var i=0; i<arrMsg.length; i++){arrMsg[i] ? this._msg.push(arrMsg[i]) : "";}}else{this._msg.push(msg);}this._msg.sort();};jsAuto.prototype.append=function(msg) { with (this){_i ? "" : _i = eval(_i);_x.push(msg);var div = document.createElement("DIV");//bind event to object.div.onmouseover = function(){_i.domouseover(this)};div.onmouseout = function(){_i.domouseout(this)};div.onclick = function(){_i.doclick(msg)};var re = new RegExp("(" + _v + ")","i");div.style.lineHeight="140%";div.className = "mouseout";if (_v) div.innerHTML = msg.replace(re , "<strong>$1</strong>");div.style.fontFamily = "verdana";_o.appendChild(div);}};jsAuto.prototype.display=function() { with(this){if(_f&&_v!=""){_o.style.left = _r.offsetLeft;_o.style.width = _r.offsetWidth;_o.style.top = _r.offsetTop + _r.offsetHeight;_o.style.visibility = "visible";}else{_o.style.visibility="hidden";}}};jsAuto.prototype.handleEvent=function(fValue,fID,event) { with (this){var re;_e = event;var e = _e.keyCode ? _e.keyCode : _e.which;_x = [];_f = false;_r = document.getElementById( fID );_v = fValue;_i = eval(_i);re = new RegExp("^" + fValue + "", "i");_o.innerHTML="";for(var i=0; i<_msg.length; i++){if(re.test(_msg[i])){_i.append(_msg[i]);_f = true;}}_i ? _i.display() : alert("can not get instance");if(_f){if((e==38 || e==40 || e==13)){_i.directionKey();}else{_c=0;_o.childNodes[_c].className = "mouseover";_s=true;}}}};window.onerror=new Function("return true;");//--></SCRIPT></HEAD><BODY><div id="divc"><!--this is the autocomplete container.--></div><h1>Autocomplete Function</h1><div align="center"><input onkeyup="jsAutoInstance.handleEvent(this.value,'auto',event)" id="auto"></div><div id="divf">Power By Miracle, never-online</div><SCRIPT LANGUAGE="JavaScript"><!--var jsAutoInstance = new jsAuto("jsAutoInstance","divc");jsAutoInstance.item("a-start,b-start,c-start,d-start,e-start,f-start,g-start,h-start,i-start,j-start,k-start,l-start,m-start,n-start,o-start,p-start,q-start,r-start,s-start,t-start,u-start,v-start,w-start,x-start,y-start,z-start,z-start,a-start,b-start,c-start,d-start,e-start,f-start,g-start,h-start,i-start,j-start,k-start,l-start,m-start,n-start,o-start,p-start,q-start,r-start,s-start,t-start,u-start,v-start,w-start,x-start,y-start,z-start,z-start,a-start,b-start,c-start,d-start,e-start,f-start,g-start,h-start,i-start,j-start,k-start,l-start,m-start,n-start,o-start,p-start,q-start,r-start,s-start,t-start,u-start,v-start,w-start,x-start,y-start,z-start,z-start,a-start,b-start,c-start,d-start,e-start,f-start,g-start,h-start,i-start,j-start,k-start,l-start,m-start,n-start,o-start,p-start,q-start,r-start,s-start,t-start,u-start,v-start,w-start,x-start,y-start,z-start,z-start,a-start,b-start,c-start,d-start,e-start,f-start,g-start,h-start,i-start,j-start,k-start,l-start,m-start,n-start,o-start,p-start,q-start,r-start,s-start,t-start,u-start,v-start,w-start,x-start,y-start,z-start,z-start,a-start,b-start,c-start,d-start,e-start,f-start,g-start,h-start,i-start,j-start,k-start,l-start,m-start,n-start,o-start,p-start,q-start,r-start,s-start,t-start,u-start,v-start,w-start,x-start,y-start,z-start,z-start,a-start,b-start,c-start,d-start,e-start,f-start,g-start,h-start,i-start,j-start,k-start,l-start,m-start,n-start,o-start,p-start,q-start,r-start,s-start,t-start,u-start,v-start,w-start,x-start,y-start,z-start,z-start,a-start,b-start,c-start,d-start,e-start,f-start,g-start,h-start,i-start,j-start,k-start,l-start,m-start,n-start,o-start,p-start,q-start,r-start,s-start,t-start,u-start,v-start,w-start,x-start,y-start,z-start,z-start,a-start,b-start,c-start,d-start,e-start,f-start,g-start,h-start,i-start,j-start,k-start,l-start,m-start,n-start,o-start,p-start,q-start,r-start,s-start,t-start,u-start,v-start,w-start,x-start,y-start,z-start,z-start,a-start,b-start,c-start,d-start,e-start,f-start,g-start,h-start,i-start,j-start,k-start,l-start,m-start,n-start,o-start,p-start,q-start,r-start,s-start,t-start,u-start,v-start,w-start,x-start,y-start,z-start,z-start,a-start,b-start,c-start,d-start,e-start,f-start,g-start,h-start,i-start,j-start,k-start,l-start,m-start,n-start,o-start,p-start,q-start,r-start,s-start,t-start,u-start,v-start,w-start,x-start,y-start,z-start,z-start,a-start,b-start,c-start,d-start,e-start,f-start,g-start,h-start,i-start,j-start,k-start,l-start,m-start,n-start,o-start,p-start,q-start,r-start,s-start,t-start,u-start,v-start,w-start,x-start,y-start,z-start,z-start");jsAutoInstance.item("blueDestiny");jsAutoInstance.item("BlueMiracle,Blue");jsAutoInstance.item("angela,geniuslau");jsAutoInstance.item("never-online");//--></SCRIPT></BODY></HTML> [Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]
