[转载]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>