<div class="codetitle"> <span><a style="CURSOR: pointer" data="36280" class="copybut" id="copybut36280" onclick="doCopy('code36280')"><u>코드 복사</u></a></span> 코드는 다음과 같습니다.</div> <div class="codebody" id="code36280"> <br><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" ><br><html xmlns="http://www.w3.org/1999/xhtml"><br><head><br><title>autoComplete</title><br>< ;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><br><style type="text/css"><br>.autoComplete {margin: 8px;position:relative;float:left;}<br>.autoComplete 입력 {width:200px;height:25px;margin:0;padding:0;line-height:25px;}<br>.autoComplete ul {z- 색인:-12;패딩:0px;여백:0px;테두리:1px #333 단색;너비:200px;배경:흰색;디스플레이:없음;위치:절대;왼쪽:0;상단:28px;*여백-왼쪽:9px ;*margin-top:2px;margin-top:1px;}<br>.autoComplete li {list-style:none;}<br>.autoComplete li a {display:block;color:#000;text-꾸밈: none;padding:1px 0 1px 5px;_width:97%;}<br>.autoComplete li a:hover {color:#000;Background:#ccc;border:none;}<br></style><br><script type="text/javascript">//<![CDATA[<BR>var getElementsByClassName = function (searchClass, node, tag) {/* 兼容各浏览器的选择class적 방법 ;(:http://www.jb51.net,想了解更多请看这个地址) */<BR> 노드 = 노드 || 문서, 태그 = 태그 ? tag.toUpperCase() : "*";<BR> if(document.getElementsByClassName){/* 支持getElementsByClassName의 浏览器 */<BR> var temp = node.getElementsByClassName(searchClass);<BR> if(tag== "*"){<BR> return temp;<BR> } else {<BR> var ret = new Array();<BR> for(var i=0; i<temp.length; i )<BR> 만약 (temp[i].nodeName==tag)<BR> ret.push(temp[i]);<BR> return ret;<BR> }<BR> }else{/*器 */ <BR> var 클래스 = searchClass.split(" "),<BR> 요소 = (태그 === "*" && node.all)? node.all : node.getElementsByTagName(tag),<BR> 패턴 = [], returnElements = [], current, match;<BR> var i =classes.length;<BR> while(--i >= 0 )<BR> 패턴.push(new RegExp("(^|s)" 클래스[i] "(s|$)"));<BR> var j = elements.length;<BR> while(--j >= 0){<BR> 현재 = 요소[j], 일치 = false;<BR> for(var k=0, kl=patterns.length; k<kl; k ){<BR> 일치 = 패턴[ k].test(current.className);<BR> if(!match) break;<BR> }<BR> if(match) returnElements.push(current);<BR> }<BR> return returnElements ;<BR> }<BR>};<BR>var addEvent=(function(){/* 用此函数添加事件防止事件覆盖 */<BR> if(document.addEventListener){<BR> 반환 함수(유형, fn) { this.addEventListener(type, fn, false) };<BR> }else if(document.attachEvent){<BR> return function(type,fn){<BR> this.attachEvent(유형, 함수 () {<BR> return fn.call(this, window.event);/* 兼容IE */<BR> });<BR> };<BR> }<BR>})();<BR>;(function(window){<BR>/* 플러그인 시작*/<BR>var autoComplete=function(o){<BR> var handler=(function(){<BR> var handler =function(e,o){ return new handler.prototype.init(e,o); };/* 여러 dom을 선택할 때 쉽게 사용할 수 있도록 선택한 dom마다 해당 객체를 생성합니다. */<BR> handler.prototype={<BR> e:null, o:null, 타이머:null, show:0, input:null, popup:null,<BR> init:function(e,o){/ * 설정 초기 객체*/<BR> this.e=e, this.o=o,<BR> this.input=this.e.getElementsByTagName(this.o.input)[0],<BR> this.popup =this .e.getElementsByTagName(this.o.popup)[0],<BR> this.initEvent();/* 다양한 이벤트 초기화*/<BR> },<BR> :match(quickExpr,value, source){/ * 프롬프트 생성*/<BR> var li = null;<BR> null ){<BR> li = document.createElement(li);<BR> li.innerHTML = <a href="javascript:;"> source[i] </a>;<BR> This.popup .appendChild(li);<BR> This.popup.style.display=block;<BR> else<BR> this.popup.style.display= 없음;<BR> },<BR> </script> </div>