博主原創**，如有**寫的不完善的地方還望大家多多指教。
html**很簡單，我們就乙個簡單的輸入框，然後乙個ul標籤，在內部可以放好多li標籤。
以上便是html**
在css中，定義也比較簡單，其中有乙個 lilight 的 class，可以使背景變色，通過 remove 和 add 這個 class，我們可以輕鬆地實現下拉列表元素是否選中的區分。
css所有樣式如下
.content inputul.list
ul.list li
.lilight
我們引入 jquery 來實現對元素的操作，實現了按鍵和滑鼠監聽，**如下
$(function()//首先讓list隱藏起來
$("ul.list").hide();
$("#email").keyup(function(event)
//如果還存在下拉選項卡，那麼將其高亮
if($("ul.list li:visible"))
}else
//輸入的內容還沒有包括@符號
if($.trim($(this).val()).match(/.*@/)==null)elseelse
});}}}
//按了回車時，將當前選中的元素寫入到文字框中
if(event.keycode==13)
});//監聽上下方向鍵
$("#email").keydown(function(event)}}
//下方向鍵按下了
if(event.keycode==38)}}
});//當滑鼠點選某個下拉項時，選中該項，下拉列表隱藏
$("ul.list li").click(function());
//當滑鼠劃過某個下拉項時，選中該項，下拉列表隱藏
$("ul.list li").hover(function());
//當滑鼠點選其他位置，下拉列表隱藏
$(document).click(function());
});
其實還有乙個比較強大的外掛程式，叫autocomplete，同樣可以實現下拉列表的自動補全，功能更加完善，如果大家有興趣可以去試一下。不過感覺最常用的就是郵箱自動補齊，而且直接用 jquery 就可以比較方便地實現，所以博主就沒有使用autocomplete外掛程式，而是自己寫了一下，一來練習一下，二來對這種功能的實現了解得更加透徹。
大家也可以嘗試下，希望小夥伴們有幫助，加油！
jquery下拉列表
由於需要 用以前發過的摺疊選單原始碼改了一下 做成了下拉列表 感覺還不錯 留著以後使用 首頁主選單.子選單.子選單.子選單.子選單.子選單.子選單.主選單.子選單.子選單.子選單.子選單.子選單.子選單.主選單.子選單.子選單.子選單.子選單.子選單.子選單.主選單.子選單.子選單.子選單.子選單....
jquery操作下拉列表select
jquery獲取select選擇的text和value 語法解釋 1.select id change function 為select新增事件，當選擇其中一項時觸發 2.var checktext select id find option selected text 獲取select選擇的tex...
JQuery操作Select下拉列表
1我被選中了2 查詢被選中的option中的內容當然也可以用 alert sel option selected text 稍微解釋一下 select name sel option selected 表示具有name 屬性，並且該屬性值為 sel 的select元素 裡面的具有selected 屬...