AutoComplete-this article is invalid, please use jquery easy-UI for more convenient (add later)

Source: Internet
Author: User

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>

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.