jQuery插件Tmpl的簡單使用方法

更新時間：2015年04月27日 09:50:55 投稿：hebedich

JavaScript 也可以利用模版來解決這些問題，比如基于 jQuery 的 jquery.tmpl，現(xiàn)在已經(jīng)被接受為官方的模版插件了。詳細的 API 在 jQuery 的 Templates 里，內(nèi)置的 demo 也盡情地演示了各種用法。

1.引入腳本

2.編寫模板

2.1假設此時有一個，從后臺一json格式發(fā)送來的數(shù)據(jù)

復制代碼代碼如下:

[{"tId":1,"tName":"張三","tAge":14,"tClass":1,"TeachClass":{"cId":1,"cName":"1班"}},

復制代碼代碼如下:

{"tId":2,"tName":"李四","tAge":25,"tClass":1,"TeachClass":{"cId":1,"cName":"1班"}},

復制代碼代碼如下:

{"tId":4,"tName":"趙六 ","tAge":16,"tClass":2,"TeachClass":{"cId":2,"cName":"2班"}}]

2.2此時你要顯示的內(nèi)容如下

然后按照你要顯示的內(nèi)容，設置模板：

【類似于aspx中的repeater控件】

【注：記得要設置id】

3.填寫模板

按照上面的假設，后臺返回的是一個json格式的字符串，那么通過ajax請求，并填寫模板

4.看到了效果頁面

以上所述就是本文的全部內(nèi)容了，希望大家能夠喜歡。

您可能感興趣的文章:

ajax的分頁查詢示例（不刷新頁面）
這篇文章主要介紹了ajax的分頁查詢示例（不刷新頁面），小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
2017-01-01
js過濾HTML標簽以及空格的思路及代碼
今天要做一個應用--判斷編輯器中文字的個數(shù)。如果少如20個字就不能讓其提交。沒多想，正好周末的時候看了一下js中正則表達式的內(nèi)容。很容易就想到了要用正則表達式來解決這個問題。雖說看了正則表達式的內(nèi)容是看了，但是畢竟還是剛接接觸，連基本的概念都很模糊，于是只好在網(wǎng)上找到如下的代碼：
2013-05-05
jQuery創(chuàng)建及操作xml格式數(shù)據(jù)示例
這篇文章主要介紹了jQuery創(chuàng)建及操作xml格式數(shù)據(jù),結合實例形式分析了jQuery針對xml格式數(shù)據(jù)的創(chuàng)建、解析、添加等相關操作技巧,需要的朋友可以參考下
2018-05-05
jquery解析XML及獲取XML節(jié)點名稱的實現(xiàn)代碼
下面小編就為大家?guī)硪黄猨query解析XML及獲取XML節(jié)點名稱的實現(xiàn)代碼。小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
2016-05-05
詳談表單格式化插件jquery.serializeJSON
下面小編就為大家?guī)硪黄斦劚韱胃袷交寮query.serializeJSON。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
2017-06-06
jQuery實現(xiàn)可兼容IE6的遮罩功能詳解
這篇文章主要介紹了jQuery實現(xiàn)可兼容IE6的遮罩功能,詳細分析了jQuery遮罩層的布局、樣式及功能實現(xiàn)技巧,需要的朋友可以參考下
2017-09-09
JQuery的一些小應用收集
JQuery框架沒有的可以在網(wǎng)上Down。
2010-03-03
jQuery操作表格（table）的常用方法、技巧匯總
雖然現(xiàn)在DIV+CSS進行頁的布局大行其道，但是很多地方使用table還是有很多優(yōu)勢，用table展示數(shù)據(jù)是比較方便的，下面匯總了jQuery操作Table tr td常用的方法，熟記這些操作技巧，下次再使用的到時候，會讓你如魚得水，提高開發(fā)效率
2014-04-04
jQuery實現(xiàn)的導航下拉菜單效果示例
這篇文章主要介紹了jQuery實現(xiàn)的導航下拉菜單效果,涉及jQuery事件響應及元素動態(tài)操作相關技巧,非常簡便實用,需要的朋友可以參考下
2016-09-09
jquery實現(xiàn)的省市區(qū)三級聯(lián)動
在做項目的時候，我們經(jīng)常需要用到地址之類的省市區(qū)三級聯(lián)動的，今天就給大家分享一個非常簡潔的省市區(qū)三級聯(lián)動的代碼，基于jQuery，附上GIT地址，有需要的小伙伴可以直接拿走
2015-04-04