En proyectos reales, podemos cambiar la adquisición de datos a adquisición dinámica de AJAX, en getContent ()
<! Doctype> <html> <fead> <title> js/jQuery realiza una forma similar a la función de búsqueda de baidu </title> <meta name = "autor" content = "Michael"> <meta name = "palabras clave" content = "js/jQuery se realiza similar a la función de búsqueda de Baidu"> <meta name = "descripción" Content = "js/jQuery realy de similar a Baidu de búsqueda de Baidu, y puede ser controlado por la búsqueda de Baidu, y puede ser controlado por Baidu, y puede ser controlado por Baidu, y puede ser controlado por Baidu, y puede ser controlado por Baidu, y puede ser controlado por Baidu, y puede ser controlado por Baidu, y puede ser controlado por Baidu, y puede controlarlo, y puede controlar Baidu, y puede ser controlado por Baidu, y puede controlarse de manera similar a Baidu, y puede controlar Baidu y teclado "> <meta http-oquiv =" content-type "content =" text/html; {posición: absoluto; izquierda: 50%; superior: 40%;}#content {float: izquierda; posición: relativa; derecha: 50%;} entrada {borde: 0; ancho: 288px; altura: 30px; font-size: 16px; almo {fondo: #87a900;}. Primero {borde: sólido #87a900 2px; ancho: 300px;} #append {border: sólido #87a900 2px; border-top: 0; display: none;} </style> <bead> <body> <d id id = "Contenedor"> <Div Id = "Content"> <Viv> "Input id =" Kw "Kw" onKeyUp = "getContent (esto);" /> </div> <div id = "append"> </div> </div> <script type = "text/javaScript"> var data = ["Hola, soy Michael", "Who Are You", "Eres el mejor", "eres el más precioso", "eres mi mejor amigo", "eres mi mejor amigo", "eres tonto", "entiendes", "eres fascinado por mí" eres mi mejor amigo "," eres mi mejor amigo "," eres tonto "," entiendes "," eres fascinado por mí "eres mi mejor amigo", "eres mi mejor amigo", "eres tonto", "? ojos "]; $ (documento) .Ready (function () {$ (documento) .keydown (function (e) {e = e || window.event; var keycode = e.which? (KeyCode == 40) {if (jQuery.trim ($ ("#append"). html ()) == "") {return;} $ ("#kw"). blur (); if ($ (". item"). Hasclass ("addBg")) {MoveNext ();} {$ (". item"). RemoveClass ('addBg'). Eq (0) .addClass ('addBg');}}} else if (keyCode == 13) {doJob ();}}); var mudepRev = function () {$ ("#kw"). blur (); var index = $ (". addBgg"). == 0) {$ (". Item"). RemoveClass ('addBg'). Eq ($ (". Item"). Longitud - 1) .addclass ('addBg');} else {$ (". Item"). RemoVeClass ('addBg'). Eq (índice - 1) .addclass ('addbg');}} var mOta (vAR) $ (". ADDBG"). PREVALL (). LENGTURA; if (index == $ (". item"). Longitud - 1) {$ (". item"). RemoveClass ('addBg'). Eq (0) .addclass ('addBg');} else {$ (". item"). removeclass ('addbg'). eq (index (index (index); 1. jQuery.trim ($ (obj) .val ()); if (kw == "") {$ ("#append"). hide (). html (""); return false;} var html = ""; for (var i = 0; i <data.length; i ++) {if (data [i] .indexof (kw)> = 0) "<div class = 'item' onMouseEnter = 'getFocus (this)' onClick = 'getCon (this);'>" + data [i] + "</div>"}} if (html! = "") {$ ("#append"). show (). html (html);} else {$ ("#append"). hide (). html ("");}} function getFocus (obj) {$ (". item"). RemoveClass ("addBg"); $ (obj) .addclass ("addBg");} function getCon (obj) {var valor = = $ (obj) .Text (); $ ("#kw"). val (valor); $ ("#append"). hide (). html ("");} </script> </body> </html>Lo anterior es el indicador de coincidencia difuso para el cuadro desplegable Automático JS IMitation Baidu presentado por el editor. Espero que sea útil para todos. Si tiene alguna pregunta, déjame un mensaje. ¡El editor responderá a todos a tiempo!