في المشاريع الفعلية ، يمكننا تغيير اكتساب البيانات إلى Ajax Dynamic Acquisition ، في getContent ()
<! doctype> <html> <head> <title> JS/jQuery يدرك مشابهًا لوظيفة بحث baidu </title> <meta name = "uputh content =" michael "> <meta name =" keywords "content =" js/jquery يدرك مشابهًا لدالة البحث baidu "> <meta name =" description " لوحة المفاتيح "> <meta http-equiv =" content-type "content =" text/html ؛ type = "text/css">#container {position: absomute ؛ اليسار: 50 ٪ ؛ أعلى: 40 ٪ ؛}#المحتوى {float: left ؛ الموضع: النسبية ؛ اليمين: 50 ٪ ؛} المدخلات {الحدود: 0 ؛ العرض: 288px ؛ الارتفاع: 30px ؛ font-size: 16px ؛ padding: 0 5px ؛ line-height: 30px ؛ 5px ؛ المؤشر: مؤشر ؛}. addbg {background: #87a900 ؛}. الأول {الحدود: Solid #87a900 2px ؛ العرض: 300px ؛} #إلحاق {border: sold #87a900 2px ؛ top-top: 0 ؛ display: none ؛} </head> id = "content"> <viv> <input id = "kw" onKeyup = "getContent (this) ؛" /> </div> <div id = "append"> </viv> </viv> <script type = "text/javaScript"> var data = ["Hello ، أنا Michael" ، "من أنت" ، "أنت الأفضل" ، "أنت تفهمن" أنت "أنت" ، أنت أغلى "،" أنت "أنت" ، Eyes "] ؛ $ (document) .Ready (function () {$ (document) .KeyDown (function (e) {e = e || window.event ؛ var keycode = (keycode == 40) {if (jquery.trim ($ ("#append"). html ()) == "") {return ؛} $ ("#kw"). blur () ؛ if ($ (". item"). hasclass ("addbg")) {$ (". item"). removeClass ('addbg'). eq (0) .addClass ('addbg') ؛}} آخر إذا (keycode == 13) {dojob () ؛}}) ؛ var moveprev = function () {$ ("#kw"). == 0) {$ (". item"). removeClass ('addbg'). eq ($ (". item"). length - 1) .addClass ('addbg') ؛} else {$ ( $ (". addbg"). prevall () 1 " jquery.trim ($ (obj) .val ()) ؛ if (kw == "") {$ ("#append"). Hide (). html ("") ؛ return false ؛} var html = "" "<div class = 'item' onMouseEnter = 'getFocus (this)' 'onClick =' getCon (this) ؛ '>" + data [i] + "</div>}} if (html! =" ") {$ ("#append "). show (). html (html) ؛ {$ ("#append"). Hide (). $ (obj) .Text () ؛ $ ("#kw"). val (value) ؛ $ ("#append")ما سبق هو موجه المطابقة الغامض لمربع المنسدلة التلقائي JS Imitation Baidu الذي أدخله المحرر. آمل أن يكون ذلك مفيدًا للجميع. إذا كان لديك أي أسئلة ، يرجى ترك رسالة لي. سوف يرد المحرر على الجميع في الوقت المناسب!