1:邏輯分析：
事件分析：在輸入框中輸入值後，下拉框即顯示，根據非同步載入得到的資訊，將資料顯示在下拉框中，此事件為獲得焦點元素事件(此事件我也有點模糊)keyup事件；
後台技術分析：獲得到文字框的輸入值name後，我們通過ajax技術，非同步去資料庫查詢資料，這裡我們一般使用模糊查詢like，只要包含該name的資料我們都查詢作為結果，但是需要注意的是，由於下拉框大小有限，資料量一般用limit條件查詢限制顯示的數量；
前台技術分析：從後台拿到資料後，我們要讓隱藏的div顯示，涉及到show()以及hide()方法，在顯示div的同時我們要將資料寫入到**中
2:**展示：
//非同步載入下拉框
$(function
() , function
(data)
html += "";
$("#dtn").show().html(html);
//滑鼠移動到某行上改變顏色
$("tr").bind("mouseover", function
() );
$("tr").bind("mouseout", function
() );
//單擊某行跳轉到詳細頁面
$("tr").bind("click", function
() );
} ,"json");
} else
});});//html頁面**
class="search">
name="serach_input"
type="text"
id="search"
placeholder="請輸入路線名稱"
class="search_input"
autocomplete="off">
class="search-button"
href="#">搜尋a>
id="dtn"
style="display:none;background-color:white;;
position:
absolute; left:
483px; top:
232.5px; width:
410px; height:
300px; border:
1pxsolid
gray;">
div>
仿百度搜尋框
1.設定和搜尋框兩個div fieldset,input,button,img ul,ol img box textsearch buttonsearch buttonsearch hover pop pop ul li pop ul li hover 3.js實現搜尋自動補充 獲取物件 var b...
Vue 百度搜尋下拉提示框
一 vue.js框架 1 乙個mvvm框架 2 vue的好處 簡單，易上手，個易維護，更適合移動端，不足 不相容低版本ie 3 指令 v model v for 這些都稱為指令 4 事件 事件已v on 開頭，縮寫是 click 一條原本的介面 去掉多餘的 wd a這個是使用者搜尋的內容，a在下文被...
百度搜尋框demo
如下 content type content text html charset utf 8 title q ul ul li ul li hover style 2.步驟二 定義demo函式 分析介面 資料 function demo data 迴圈的li寫入ul ul.innerhtml ht...