JQuery.tmpl()的用法
动态请求数据来更新页面是现在非常常用的方法,现在通过Ajax请求返回的数据更多的是json对象,
为了解决js动态拼接数据这方面的问题,JavaScript 也可以利用模版来解决这些问题,比如基于 jQuery 的 jquery.tmpl。
Tmpl提供了几种tag:
${}:等同于{{=}},是输出变量,通过了html编码的。
{{html}}:输出变量html,但是没有html编码,适合输出html代码。
{{if }} {{else}}:提供了分支逻辑。
{{each}}:提供循环逻辑,$value访问迭代变量。
jquery tmpl的使用方法:
模板定义:
${}为json的键的值,必须要填写正确,和<%#Eval()%>这个作用一样
先设置好模板:
<script id="movieTemplate" type="text/x-jquery-tmpl">
<li>
<b>${Name}</b> (${ReleaseYear})
</li>
</script>
再看数据源:
var movies = [
{ Name: "The Red Violin", ReleaseYear: "" },
{ Name: "Eyes Wide Shut", ReleaseYear: "" },
{ Name: "The Inheritance", ReleaseYear: "" }
];
最后Script 代码:
<script src="/js/jquery.tmpl.min.js"></script>
$( "#movieTemplate" ).tmpl( movies ) //获得替换占位符后的值
.appendTo( "#movieList" );
JQuery.tmpl()的用法的更多相关文章
- jquery.tmpl.min.js--前端实现模版--数据绑定--详解
动态请求数据来更新页面是现在非常常用的方法,比如博客评论的分页动态加载,微博的滚动加载和定时请求加载等. 这些情况下,动态请求返回的数据一般不是已拼好的 HTML 就是 JSON 或 XML,总之不在 ...
- jquery tmpl 详解(转)
动态请求数据来更新页面是现在非常常用的方法,比如博客评论的分页动态加载,微博的滚动加载和定时请求加载等. 这些情况下,动态请求返回的数据一般不是已拼好的 HTML 就是 JSON 或 XML,总之不在 ...
- Jquery tmpl详解
Jquery tmpl是动态请求数据来更新页面非常常用的方法,比如博客评论的分页动态加载,微博的滚动加载和定时请求加载等. 这些情况下,动态请求返回的数据一般不是已拼好的 HTML 就是 JSON 或 ...
- jQuery .tmpl() 用法
动态请求数据来更新页面是现在非常常用的方法,比如博客评论的分页动态加载,微博的滚动加载和定时请求加载等. 这些情况下,动态请求返回的数据一般不是已拼好的 HTML 就是 JSON 或 XML,总之不在 ...
- jquery.tmpl.js 模板引擎用法
1.0 引入: <script src="/js/jquery.tmpl.min.js"></script> 2.0 模板: <script type ...
- jQuery tmpl用法总结
之前很是头疼循环数据的渲染,搞一大堆的命名,一点点的赋值,很是麻烦,今天学习了一下jQuery插件tmpl,下面抛出一些使用方法,供以后参考: 官方网址:http://web.archive.org/ ...
- jquery tmpl 详解
官方解释对该插件的说明:将匹配的第一个元素作为模板,render指定的数据,签名如下: .tmpl([data,][options]) 其中参数data的用途很明显:用于render的数据,可以是任意 ...
- [转载]jquery tmpl使用方法
动态请求数据来更新页面是现在非常常用的方法,比如博客评论的分页动态加载,微博的滚动加载和定时请求加载等. 这些情况下,动态请求返回的数据一般不是已拼好的 HTML 就是 JSON 或 XML,总之不在 ...
- jQuery .tmpl(), .template()学习资料小结
昨晚无意中发现一个有趣的jQuery插件.tmpl(),其文档在这里.官方解释对该插件的说明:将匹配的第一个元素作为模板,render指定的数据,签名如下: .tmpl([data,][options ...
随机推荐
- 九度OJ1207
题目给你了一个很大的n,然后让你去计算它的质因数.对N进行开方得到的是一个大约在32000左右的数,我们可以用埃氏筛法进行素数打表.对所有prime[i]<=sqrt(n),分别看prime[i ...
- photoshop如何选择图层?
选择移动工具,在上边的属性栏里勾选"自动选择图层"功能即可. 只要打上勾, 并且配上是选择图层,还是组, 点到哪里就选中哪里. 参考: http://zhidao.baidu. ...
- django不要设置datetime字段auto_now=True
django model的datetime字段如果设置了auto_now=True的话,update该记录的时候即使没有更新它的时间字段,它的时间字段依然会执行一遍auto_now,时间会变成当前更新 ...
- [SQL]SqL给局部变量赋值有两种方法
给局部变量赋值有两种方法: .SET @variable_name=value .SELECT @variable_name=value 两者的区别:SET赋值语句一般用于赋给变量一个指定的常量,SE ...
- [SQL]分组排练进行更新
--方法(一):分组排练进行更新 ----------------------------------------------------------------------------------- ...
- [CF 475D] CGCDSSQ (RMQ)
题目链接:http://codeforces.com/contest/475/problem/D 是昨天晚上的CF题目,题意是给定你n个数,问你所有子区间内的最小公约数是x的个数是多少 问的康神,了解 ...
- [HDU 4747] Mex (线段树)
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=4747 这道题是我去年刚入校队的时候参加网赛的题目. 一年过去了,我依然还是不会做.. 这是我难题计划的 ...
- PHP截取IE浏览器并缩小原图的方法
这篇文章主要介绍了PHP截取IE浏览器并缩小原图的方法,涉及PHP调用com组件实现图像截取的相关技巧,需要的朋友可以参考下 本文实例讲述了PHP截取IE浏览器并缩小原图的方法.分享给大家供大家参考, ...
- 日期:Date
API--- java.util.Date:日期类,月份从0-11: 日期对象和毫秒值之间的转换. 1,日期对象转成毫秒值.Date类中的getTime方法. 2,如何将获取到的毫秒值转成具体的日期呢 ...
- android shape的使用 边框
android中常常使用shape来定义控件的一些显示属性,今天看了一些shape的使用,对shape有了大体的了解,稍作总结: 先写drawable里面的xml文件,里面设置shape来设置文本框的 ...