This article is invalid. Use jquery easy-UI to make it more convenient (add later)
After a long time, the system failed to enable automatic prompts. Today, it's hard to find it online and record it.
<HTML> <br/> <pead> </P> <p> <title> imitating IE's automatic function, read input box access record </title> <br/> <MCE: style> <! -- </P> <p> body, div {< br/> font-family: verdana; <br/> line-Height: 100%; <br/> font-size: 9pt; <br/>}< br/> input {<br/> width: 300px; <br/>}< br/> H1 {<br/> text-align: center; <br/> font-size: 2.2em; <br/>}< br/> # divf {<br/> margin: 10px; <br/> font-size: 0.8em; <br/> text-align: center; <br/>}< br/># divc {<br/> border: 1px solid #333333; <br/>}< br/>. des {<br/> width: 500px; <br/> background-color: Light Yellow; <br/> border: 1px solid #333; <br/> padding: 20px; <br/> margin-top: 20px; <br/>}< br/>. mouseover {<br/> color: # ffffff; <br/> background-color: highlight; <br/> width: 100%; <br/> cursor: default; <br/>}< br/>. mouseout {<br/> color: #000000; <br/> width: 100%; <br/> background-color: # ffffff; <br/> cursor: default; <br/>}< br/> --> </MCE: style> <style mce_bogus = "1"> <br/> body, div {<br/> font-family: Verdana; <br/> line-Height: 100%; <br/> font-size: 9pt; <br/>}< br/> input {<br/> width: 300px; <br/>}< br/> H1 {<br/> text-align: center; <br/> font-size: 2.2em; <br/>}< br/> # divf {<br/> margin: 10px; <br/> font-size: 0.8em; <br/> text-align: center; <br/>}< br/> # divc {<br/> border: 1px solid #333333; <br/>}< br/>. des {<br/> width: 500px; <br/> background-color: lightyellow; <br/> border: 1px solid #333; <Br/> padding: 20px; <br/> margin-top: 20px; <br/>}< br/>. mouseover {<br/> color: # ffffff; <br/> background-color: highlight; <br/> width: 100%; <br/> cursor: default; <br/>}< br/>. mouseout {<br/> color: #000000; <br/> width: 100%; <br/> background-color: # ffffff; <br/> cursor: default; <br/>}</style> <br/> <script language = "JavaScript"> <br/> <! -- </P> <p> // script by bluedestiny <br/> // Email: bluedestiny [at] 126. com </P> <p> // object: jsauto <br/> // Browser: IE, MF. <br/> // example: </P> <p> // Step1: <br/> // create AutoComplete container, return object and bind event to the object, and <br/> // create a new jsauto instance: <br/> // <Div id = "divautocomplete"> </div> <br/> // var AutoComplete = new jsauto ("AutoComplete", "divautocomplete") <Br/> // handle event: <br/> // autocomplete. handleevent (value, returnobjectid) <br/> // <input id = "rautocomplete" onkeyup = "autocomplete. handleevent (this. value, "ratocomplete", event)> </P> <p> // step2: <br/> // Add autocompete item: <br/> // autocomplete. item (string) <br/> // string must be a string var, you can split the string by "," <br/> // autocomplete. item ("bluedestiny, never-Online, csdn, blueidea") </P> <p> // http://www.never-online.com </P> <p> function jsauto (InstanceName, objid) <br/> {<br/> This. _ MSG = []; <br/> This. _ x = NULL; <br/> This. _ o = document. getelementbyid (objid); <br/> If (! This. _ o) return; <br/> This. _ f = NULL; <br/> This. _ I = InstanceName; <br/> This. _ r = NULL; <br/> This. _ c = 0; <br/> This. _ S = false; <br/> This. _ v = NULL; <br/> This. _ o. style. visibility = "hidden"; <br/> This. _ o. style. position = "absolute"; <br/> This. _ o. style. zindex = "9999"; <br/> This. _ o. style. overflow = "Auto"; <br/> This. _ o. style. height = "50"; <br/> return this; <br/>}; </P> <p> jsauto. prototype. Direkey key = function () {with (this) <br/>{< br/> var E = _ E. keycode? _ E. keycode: _ e. which; <br/> var L = _ o. childnodes. length; <br/> (_ c> L-1 | _ c <0 )? _ S = false: ""; </P> <p> If (E = 40 & _ s) <br/>{< br/> _ o. childnodes [_ C]. classname = "mouseout"; <br/> (_ c> = L-1 )? _ C = 0: _ c ++; <br/> _ o. childnodes [_ C]. classname = "Mouseover"; <br/>}< br/> If (E = 38 & _ s) <br/>{< br/> _ o. childnodes [_ C]. classname = "mouseout"; <br/> _ c -- <= 0? _ C = _ o. childnodes. length-1: ""; <br/> _ o. childnodes [_ C]. classname = "Mouseover"; <br/>}< br/> If (E = 13) <br/>{< br/> If (_ o. childnodes [_ c] & _ o. style. visibility = "visible") <br/>{< br/> _ r. value = _ x [_ c]; <br/> _ o. style. visibility = "hidden"; <br/>}</P> <p> If (! _ S) <br/>{< br/> _ c = 0; <br/> _ o. childnodes [_ C]. classname = "Mouseover"; <br/> _ S = true; <br/>}< br/>}; </P> <p> // mouseevent. <br/> jsauto. prototype. domouseover = function (OBJ) {with (this) <br/>{< br/> _ o. childnodes [_ C]. classname = "mouseout"; <br/> _ c = 0; <br/> obj. tagname = "Div "? OBJ. classname = "Mouseover": obj. parentelement. classname = "Mouseover"; <br/>};< br/> jsauto. prototype. domouseout = function (OBJ) <br/>{< br/> obj. tagname = "Div "? OBJ. classname = "mouseout": obj. parentelement. classname = "mouseout"; <br/>}; <br/> jsauto.prototype.doc lick = function (MSG) {with (this) <br/>{< br/> If (_ r) <br/>{< br/> _ r. value = MSG; <br/> _ o. style. visibility = "hidden"; <br/>}< br/> else <br/>{< br/> alert ("javascript AutoComplete error: NN can not get return object. "); <br/> return; <br/>}< br/>};</P> <p> // object method; <br/> jsauto. prototy PE. item = function (MSG) <br/>{< br/> If (MSG. indexof (",")> 0) <br/>{< br/> var arrmsg = MSG. split (","); <br/> for (VAR I = 0; I <arrmsg. length; I ++) <br/>{< br/> arrmsg [I]? This. _ MSG. push (arrmsg [I]): ""; <br/>}< br/> else <br/>{< br/> This. _ MSG. push (MSG); <br/>}< br/> This. _ MSG. sort (); <br/>}; <br/> jsauto. prototype. append = function (MSG) {with (this) <br/>{< br/> _ I? "": _ I = eval (_ I); <br/> _ x. push (MSG); <br/> var DIV = document. createelement ("Div"); </P> <p> // bind event to object. <br/> Div. onmouseover = function () {_ I. domouseover (this) }; <br/> Div. onmouseout = function () {_ I. domouseout (this) }; <br/> Div. onclick = function({{_ I .doc lick (MSG)}; <br/> var Re = new Regexp ("(" + _ v + ")", "I "); <br/> Div. style. lineheight = "140%"; <br/> Div. classname = "mouseout"; <br /> If (_ v) Div. innerhtml = MSG. replace (Re, "<strong> $1 </strong>"); <br/> Div. style. fontfamily = "verdana"; </P> <p> _ o. appendchild (DIV); <br/>}; <br/> jsauto. prototype. display = function () {with (this) <br/>{< br/> If (_ F & _ V! = "") <Br/>{< br/> _ o. style. left = _ r. offsetleft; <br/> _ o. style. width = _ r. offsetwidth; <br/> _ o. style. top = _ r. offsettop + _ r. offsetheight; <br/> _ o. style. visibility = "visible"; <br/>}< br/> else <br/>{< br/> _ o. style. visibility = "hidden"; <br/>}< br/>}; <br/> jsauto. prototype. handleevent = function (fvalue, FID, event) {with (this) <br/>{< br/> var re; <br/> _ e = event; <br/> var E = _ e. keycode? _ E. keycode: _ e. which; <br/> _ x = []; <br/> _ f = false; <br/> _ r = document. getelementbyid (FID); <br/> _ v = fvalue; <br/> _ I = eval (_ I ); <br/> Re = new Regexp ("^" + fvalue + "", "I"); <br/> _ o. innerhtml = ""; </P> <p> for (VAR I = 0; I <_ MSG. length; I ++) <br/>{< br/> If (Re. test (_ MSG [I]) <br/>{< br/> _ I. append (_ MSG [I]); <br/> _ f = true; <br/>}</P> <p> _ I? _ I. display (): Alert ("can not get instance"); </P> <p> If (_ F) <br/>{< br/> If (E = 38 | E = 40 | E = 13 )) <br/>{< br/> _ I. direkey key (); <br/>}< br/> else <br/>{< br/> _ c = 0; <br/> _ o. childnodes [_ C]. classname = "Mouseover"; <br/> _ S = true; <br/>}< br/>}; <br/> window. onerror = new function ("Return true ;"); <br/> // --> <br/> </SCRIPT> <br/> </pead> </P> <p> <body> <br/> <Div id = "divc"> <br/> <! -- This is the autocomplete container. --> <br/> </div> <br/> <p> AutoComplete function </p> <br/> <Div align = "center"> <br/> <input onkeyup = "jsautoinstance. handleevent (this. value, 'auto', event) "id =" Auto "> <br/> </div> <br/> <Div id =" divf "> <br/> power by miracle, never-Online <br/> </div> </P> <p> <script language = "JavaScript"> <br/> <! -- <Br/> var jsautoinstance = new jsauto ("jsautoinstance", "divc"); <br/> 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 "); <br/> jsautoinstance. item ("bluedestiny"); <br/> jsautoinstance. item ("bluemiracle, blue"); <br/> jsautoinstance. item ("Angela, geniuslau"); <br/> jsautoinstance. item ("Never-Online "); <br/> // --> <br/> </SCRIPT> <br/> <center> enter a letter and choose _-</center> <br/> </body> <br/> </ptml>