推荐好用的Jquery模板插件Jtemplate(2)
{#for}
例子:
{#for index = 1 to 10} {$T.index} {#/for}
{#for index = 1 to 10 step=3} {$T.index} {#/for}
3、渲染模板并展示
<script type="text/javascript">
$(document).ready(function() {
// 设置模板
$("#result").setTemplateElement("templateContainer");
// 处理模板
$("#result").processTemplate(data);
});
</script>
设置模板的几种方法:
a. setTemplateElement:参数为页面中的一个元素ID
如上面的例子
b. setTemplate: 参数为具体的模板内容,
如:$("#result").setTemplate("Template by {$T.bold()} version <em>{$Q.version}</em>.");
c.setTemplateURL:使用外部独立模板文件Url作为参数
如:$("#result").setTemplateURL("example_multitemplate1.tpl");
4、运行结果:
完整代码
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery-jtemplates.js"></script>
<title>jTemplates</title>
<script type="text/javascript">
var data ={
TotalCount:64,
Lists:[
{Id:'2001' ,Title:'新闻11',CreateDate:'2011-08-08'},
{Id:'2002' ,Title:'新闻22',CreateDate:'2011-08-08'},
{Id:'2003' ,Title:'新闻33',CreateDate:'2011-08-08'},
{Id:'2004' ,Title:'新闻44',CreateDate:'2011-08-08'},
相关新闻>>
- 发表评论
-
- 最新评论 更多>>