jQuery實(shí)現(xiàn)Twitter的自動(dòng)文字補(bǔ)齊特效
上圖效果可以使用jQuery插件Typeahead.js來實(shí)現(xiàn)，這款jQuery插件來自于Twitter的一個(gè)新的項(xiàng)目，支持遠(yuǎn)程和本地的數(shù)據(jù)集。比較有特色的地方在于你可以將數(shù)據(jù)集使用本地存儲(chǔ)(local storage)來保存在本地，有效的提高用戶體驗(yàn)。同時(shí)也擁有很多遠(yuǎn)程數(shù)據(jù)集的處理選項(xiàng)，例如（請求頻率，最大的并發(fā)請求數(shù)，等等）。
主要特性
支持?jǐn)?shù)據(jù)本地保存，客戶端加載，優(yōu)化加載速度
支持多語言，并且支持阿拉伯文
支持Hogan.js模板引擎整合
支持多數(shù)據(jù)集拼裝
支持本地和遠(yuǎn)程的數(shù)據(jù)集
項(xiàng)目地址
http://twitter.github.io/typeahead.js
如何使用
首先在網(wǎng)頁 head 中引入 jQuery 框架和 Typeahead.js 插件的相關(guān) JS 和 CSS 文件
<link href= "typeahead.min.css" rel= "stylesheet" >
<script src= "jquery-1.9.1.min.js" ></script>
<script src= "typeahead.min.js" ></script>
然后添加要想實(shí)現(xiàn)動(dòng)畫的 HTML 元素，如
<input id= "demo" class = "typeahead" type= "text" placeholder= "test" >
最后初始化
view source
$( '#demo' ).typeahead({
name: 'test' ,
local: [ "Site518" , "Lwolf" ],
limit: 10
});
相關(guān)文章
JQuery居然沒有操作cookie相關(guān)的函數(shù)，搜了下官方有個(gè)cookie的插件。2010-04-04
jQuery實(shí)現(xiàn)動(dòng)態(tài)添加節(jié)點(diǎn)與遍歷節(jié)點(diǎn)功能示例
這篇文章主要介紹了jQuery實(shí)現(xiàn)動(dòng)態(tài)添加節(jié)點(diǎn)與遍歷節(jié)點(diǎn)功能,結(jié)合實(shí)例形式分析了jQuery針對頁面元素節(jié)點(diǎn)元素的動(dòng)態(tài)添加與遍歷相關(guān)操作技巧,需要的朋友可以參考下2017-11-11
jquery的總體架構(gòu)分析及實(shí)現(xiàn)示例詳解
學(xué)習(xí)開源框架，童鞋們最想學(xué)到的就是設(shè)計(jì)的思想和實(shí)現(xiàn)的技巧。最近研究jQuery源碼，記錄一下我對jquery的理解和心得，跟大家分享，權(quán)當(dāng)拋磚引玉。2014-11-11
artDialog雙擊會(huì)關(guān)閉對話框的修改過程分享
artDialog，一個(gè)jquery的對話框插件但是在使用時(shí)發(fā)現(xiàn)鼠標(biāo)雙擊時(shí)會(huì)自半對話框，下面與大家分享下具體的修改過程，感興趣的朋友可以參考下2013-08-08
jQuery代碼實(shí)現(xiàn)實(shí)時(shí)獲取時(shí)間
這篇文章主要介紹了jQuery代碼實(shí)現(xiàn)實(shí)時(shí)獲取時(shí)間功能，代碼簡單易懂，非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友參考下吧2017-01-01
JQuery實(shí)現(xiàn)的彈出層，js和css可根據(jù)自己的實(shí)際情況而定，下面是具體的實(shí)現(xiàn)代碼，大家不妨參考下2014-05-05
jQuery實(shí)現(xiàn)跨域iframe接口方法調(diào)用
頁面a.html域名為www.a.com嵌入頁面http://www.b.com/b.html,b.html要調(diào)用a.html中的js函數(shù)，由于兩個(gè)頁面不在一個(gè)域中，會(huì)提示沒權(quán)限。如何解決該問題呢，請看下面示例代碼。2015-03-03
jquery之a(chǎn)jaxfileupload異步上傳插件(附工程代碼)
在處理文件上傳時(shí)需要使用到文件的異步上傳，這里使用Jquery Ajax File Uploader這個(gè)組件,服務(wù)器端采用struts2來處理文件上傳2013-04-04
jquery Ajax 全局調(diào)用封裝實(shí)例詳解
這篇文章主要介紹了jquery Ajax 全局調(diào)用封裝實(shí)例詳解的相關(guān)資料,需要的朋友可以參考下2017-01-01
這篇文章主要介紹了jQuery簡單實(shí)現(xiàn)禁用右鍵菜單的方法，非常的簡單實(shí)用，這里分享給大家，有需要的小伙伴直接拿走使用。2015-03-03