jquery 模板的應(yīng)用示例
更新時(shí)間：2013年11月12日 17:18:30 作者：
模板的使用在jqery中還是比較廣泛的，在本文有個(gè)不錯(cuò)的示例，大家可以參考下
復(fù)制代碼 代碼如下:
<body>
<h1>天地盟主 QQ：467713292</h1>
<!-- 將模版放置的位置標(biāo)簽 -->
<div id="contactContainer"></div>
<!-- 定義模板的內(nèi)容布局 和定義顯示的字段 -->
<script id="contactTemplate" type="text/html">
<div>
姓名: {{= name }} <br />
手機(jī)號(hào): {{= phone }}
</div>
</script>
//引用兩個(gè)js
復(fù)制代碼 代碼如下:
<script src="Scripts/jquery-1.4.2.js" type="text/javascript"></script>
<script src="Scripts/jquery.tmpl.js" type="text/javascript"></script>
<script type="text/javascript">
var contacts = [
{name:"天地盟主", phone:"467713292"},
{name:"與狼共舞", phone: "206-555-7878" },
{name:"程序員中的菜鳥", phone: "415-555-8888" }
];
//只需要這樣一句話就可以將上面定義好的json數(shù)據(jù)填充到模板里 呈現(xiàn)出來(lái)
復(fù)制代碼 代碼如下:
$("#contactTemplate").render(contacts).appendTo("#contactContainer");
</script>
</body>
相關(guān)文章
jQuery實(shí)現(xiàn)的上拉刷新功能組件示例
這篇文章主要介紹了jQuery實(shí)現(xiàn)的上拉刷新功能組件,涉及jQuery事件響應(yīng)與頁(yè)面元素屬性動(dòng)態(tài)操作相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下2020-05-05
這篇文章主要介紹了jQuery老黃歷完整實(shí)現(xiàn)方法,詳細(xì)講述了基于jQuery實(shí)現(xiàn)黃歷的詳細(xì)步驟與技巧,需要的朋友可以參考下2015-01-01
這篇文章主要介紹了jQuery實(shí)現(xiàn)圖片局部放大鏡效果的相關(guān)資料,需要的朋友可以參考下2016-03-03
jQuery 移動(dòng)端拖拽（模塊化開發(fā)，觸摸事件，webpack）
這篇文章主要介紹了jQuery 移動(dòng)端拖拽（模塊化開發(fā)，觸摸事件，webpack）的相關(guān)資料,非常不錯(cuò)具有參考借鑒價(jià)值，需要的朋友可以參考下2016-10-10
jQuery autoComplete插件兩種使用方式及動(dòng)態(tài)改變參數(shù)值的方法詳解
這篇文章主要介紹了jQuery autoComplete插件兩種使用方式及動(dòng)態(tài)改變參數(shù)值的方法,結(jié)合實(shí)例形式分析了jQuery自動(dòng)匹配插件autoComplete的使用技巧與動(dòng)態(tài)改變參數(shù)傳入值的實(shí)現(xiàn)方法,需要的朋友可以參考下2016-10-10
jquery實(shí)現(xiàn)九宮格大轉(zhuǎn)盤抽獎(jiǎng)
jQuery九宮格大轉(zhuǎn)盤抽獎(jiǎng)代碼網(wǎng)頁(yè)特效，點(diǎn)擊抽獎(jiǎng)按鈕開始隨機(jī)抽獎(jiǎng)選擇獎(jiǎng)品，可設(shè)置起點(diǎn)位置、獎(jiǎng)品數(shù)量、轉(zhuǎn)動(dòng)次數(shù)、中獎(jiǎng)位置參數(shù)2015-11-11
jQuery中關(guān)于ScrollableGridPlugin.js（固定表頭）插件的使用逐步解析
以前寫前臺(tái)的時(shí)候需要用哪些效果從來(lái)都是有現(xiàn)成的東西拿來(lái)就用的，因?yàn)樽约赫娴氖怯行?，毫無(wú)探索精神，只重視結(jié)果，不追求過(guò)程2014-07-07
使用jQuery調(diào)用XML實(shí)現(xiàn)無(wú)刷新即時(shí)聊天
這篇文章主要介紹了使用jQuery調(diào)用XML實(shí)現(xiàn)無(wú)刷新即時(shí)聊天的相關(guān)資料,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下2016-08-08
下面小編就為大家?guī)?lái)一篇淺談jQuery中事情的動(dòng)態(tài)綁定。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-02-02
jquery插件bootstrapValidator表單驗(yàn)證詳解
這篇文章主要為大家詳細(xì)介紹了jquery插件bootstrapValidator表單驗(yàn)證，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-12-12