[转载]jtemplates jquery模板引擎使用

[转载]jtemplates jquery模板引擎使用 – 蛰穴灵异 技术博客 – 博客园.

工作中需要在前端将json数据源绑定到页面html代码中,之前一直用组合html代码的形式编写,不太容易维护。Ms ajax4.0据说有一套模板引擎,只有预览版,而且看来比较复杂,不太能马上用。在网上找到一个jtemplates的js模板引擎,感觉还可以,适合 用来在页面上动态绑定数据。

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head runat=”server”>
<title>Index</title>
<script src=”/Scripts/JQuery-1.3.2.js” type=”text/JavaScript></script>
<script src=”/Scripts/plugins/JQuery-jtemplates.js” type=”text/JavaScript></script>

<script type=”text/JavaScript>
$(document).ready(
function() {
var data = [{ name1: 测试信息,id:12 },{ name1: 测试信息,id:12 }];
$(
#result).setTemplateElement(template1);
$(
#result).processTemplate(data);
});
</script>
</head>
<body>
<div>
<textarea id=”template1″ style=”display: none;”>
<table>
<thead>
<tr>
<td colspan=”2″>
fdaasfd
</td>
</tr>
</thead>
<tbody>
{#foreach $T as r}
<tr>
<td>
name:{$T.r.name1}
</td>
<td>
id:{$T.r.id}
</td>
</tr>
{#/for}
</tbody>
<tfoot>
</tfoot>
</table>
</textarea>
</div>

<div id=”result”></div>
</body>
</html>

赞(0) 打赏
分享到: 更多 (0)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏