郵箱的廣泛使用得益于它的免費(fèi)，因此很多網(wǎng)站在注冊(cè)的時(shí)候都會(huì)直接使用郵箱作為賬號(hào)名

為了提高用戶的體驗(yàn)，很多網(wǎng)站都會(huì)實(shí)現(xiàn)郵箱輸入的自動(dòng)提示功能。

實(shí)現(xiàn)效果如圖所示：

核心代碼（需要jquery的支持）：

html示例：

常用郵箱：

調(diào)用的jquery代碼：

css，這大家自己修改成自己想要的色調(diào)

效果二：

1、此插件為寬度自適應(yīng)的，也就是當(dāng)內(nèi)部文字過長(zhǎng)時(shí)，外部的div會(huì)寬度自動(dòng)延伸的。在自定義CSS時(shí)如果設(shè)置了寬度值，則在非IE6瀏覽器下，寬度自適應(yīng)失效；
2、無需在樣式中為最外部的box設(shè)置position屬性，或是寬度及高度，這些工作jQuery 插件已經(jīng)幫你完成，設(shè)置了這些屬性反而不利于效果的展現(xiàn)；
3、此插件只能使用在單行文本框上，由于未對(duì)其他標(biāo)簽類型的元素做限制，所以如果綁定對(duì)象不正確，可能會(huì)出現(xiàn)一些意想不到的情況.
4.歡迎在使用中提出各種問題和bug.
--------------------------------------------
注:使用方法
CSS代碼：

.out_box{border:1px solid #ccc; background:#fff; font:12px/20px Tahoma;}
.list_box{border-bottom:1px solid #eee; padding:0 5px; cursor:pointer;}
.focus_box{background:#f0f3f9;}
.mark_box{color:#c00;}

JS代碼：

聲明：本網(wǎng)頁內(nèi)容旨在傳播知識(shí)，若有侵權(quán)等問題請(qǐng)及時(shí)與本網(wǎng)聯(lián)系，我們將在第一時(shí)間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com