Jquery.tmpl
一.使用方法
引入Jquery
引入 tmpl
<script src="../Scripts/jquery-1.12.4.min.js"></script>
<script src="../Scripts/jquery.tmpl.min.js"></script>
定义模板块
<script id="template" type="text/x-jquery-tmpl">
//重复项
</script>
二.基本使用示例
<!DOCTYPEhtml>
<htmllang="en">
<head>
<metacharset="UTF-8">
<title>Title</title>
<scriptsrc="js/jquery-1.11.0.js"></script>
<scriptsrc="js/jquery.tmpl.js"></script>
</head>
<body>
<tableid="div_demo"border="1">
<tr>
<td>编号</td><td>姓名</td><td>年龄</td><td>状态</td>
</tr>
</table>
<!--定义模板-->
<scriptid="demo"type="text/x-jquery-tmpl">
<tr>
<td>${ID}</td>
<td>{{= Name}}</td> /*同占位符作用相同，注意空格*/
<td>${Number(Age)+1}</td> /*可以是表达式*/
<td>${Status}</td>
</tr>
</script>
<scripttype="text/javascript">
varusers= [{ID:'S1001',Name:'Joseph Chan',Age:'18',Status:1},
{ID:'S1002',Name:'Mary Cheung',Age:'20'}];
// 引用模板在Table中显示数据
$("#demo").tmpl(users).appendTo('#div_demo');
</script>
</body>
<
ml>
实现思路
获取数据源 tmpl(JsonDataBase)
通过插件的tmpl方法可以对模板进行绑定数据在追加XX元素上
绑定字段的三种方式
${name}
{{= name}}
{{html name }}
绑定时的判断
{{if $data.Status==1 }}
禁用
{{else}}
正常
{{/if}}
更多方法尽在
Jquery.tmpl的更多相关文章
- jquery tmpl 详解
官方解释对该插件的说明:将匹配的第一个元素作为模板,render指定的数据,签名如下: .tmpl([data,][options]) 其中参数data的用途很明显:用于render的数据,可以是任意 ...
- artTemplate里一个比不上jQuery tmpl模板的地方就是放一个数组进去它不会自动循环.
artTemplate里一个比不上jQuery tmpl模板的地方就是放一个数组进去它不会自动循环.
- jquery.tmpl.js 模板引擎用法
1.0 引入: <script src="/js/jquery.tmpl.min.js"></script> 2.0 模板: <script type ...
- MVC - 11（下）jquery.tmpl.js +ajax分页
继续 mvc-11(上).dto:http://www.cnblogs.com/tangge/p/3840060.html jquery.tmpl.js 下载:http://pan.baidu.com ...
- jquery tmpl遍历
最近发现大家用模板渲染一些顺带逻辑功能代码块时,用jquery tmpl较多,遇到了一些问题,现在就个人以前研究过的一切常用功能作介绍,主要针对遍历,其它的大家可以自行浏览一起网站,如:http:// ...
- jQuery tmpl用法总结
之前很是头疼循环数据的渲染,搞一大堆的命名,一点点的赋值,很是麻烦,今天学习了一下jQuery插件tmpl,下面抛出一些使用方法,供以后参考: 官方网址:http://web.archive.org/ ...
- JQuery.tmpl()的用法
动态请求数据来更新页面是现在非常常用的方法,现在通过Ajax请求返回的数据更多的是json对象, 为了解决js动态拼接数据这方面的问题,JavaScript 也可以利用模版来解决这些问题,比如基于 j ...
- jQuery .tmpl() 用法
动态请求数据来更新页面是现在非常常用的方法,比如博客评论的分页动态加载,微博的滚动加载和定时请求加载等. 这些情况下,动态请求返回的数据一般不是已拼好的 HTML 就是 JSON 或 XML,总之不在 ...
- 让jquery.tmpl.js支持index序号
在写Web程序时,想简单处理会使用JS模板,常用的是Jquery的jquery.tmpl.js插件.整个插件还是比较好用的,后续有机会结合实际应用案例,分享下应用方法. 本次文章想分享的一点是其中的一 ...
- jquery.tmpl.min.js--前端实现模版--数据绑定--详解
动态请求数据来更新页面是现在非常常用的方法,比如博客评论的分页动态加载,微博的滚动加载和定时请求加载等. 这些情况下,动态请求返回的数据一般不是已拼好的 HTML 就是 JSON 或 XML,总之不在 ...
随机推荐
- XYZZY spfa 最长路 判环
题意: 有n个点 m条边 每个边有权值 一开始有一百血 每次经过一条路都会加上其权值 判断是否能够到达n 显然 有正环的时候肯定能够到达 最短路好题!!!!!!! 显用folyed判断是否联通 ...
- 关于<超文本>定义
百度百科定义: 1, 超文本是用超链接的方法,将各种不同空间的文字信息组织在一起的网状文本.它更是一种用户界面范式,用以显示文本及与文本之间相关的内容.现时超文本普遍以电子文档方式存在,其中的文字包含 ...
- in 索引失效的问题
先安利一篇博文MySQL的or/in/union与索引优化 简单的in查询 索引失效: 步骤 1.检查建立索引没有 order_status 字段为普通索引的tinyint类型 2.检查是否使用了使索 ...
- 【ABP.Net】2.多数据库支持&&初始化数据库
abp默认连接的数据库是MSSQL,但是在开发过程中往往很多开发者不满足于mssql. 所以这里演示一下把mssql改成postgresql,来进行接下来的系统开发. abp的orm是用EF的.那么我 ...
- setParameter不支持传统的按位置查询方式
setParameter不支持传统的按位置查询方式 String hql = "from Customer as c where c.cust_id = ?"; List<C ...
- Run Keyword And Ignore Error，Run Keyword And Return Status，Run Keyword And Continue On Failure，Run Keyword And Expect Error，Wait Until Keyword Succeeds用法
*** Test Cases ***case1 #即使错误也继续执行,也不记录失败,且可以返回执行状态和错误信息 ${Run Keyword And Ignore Error status} ${st ...
- 大数加法~HDU 1002 A + B Problem II
题目链接: http://acm.hdu.edu.cn/showproblem.php?pid=1002 题意: 数学题,A+B; 思路,这个数非常大,普通加法一定会超时,所以用大数加法.大数加法的基 ...
- MyBatis3系列__04CRUD以及参数处理
本文将会简单介绍一下MyBatis的CRUD以及结合源码讲解一下MyBatis对参数的处理. 作为一个ORM框架,最基本的使用也就是CRUD了,MyBatis提供了两种方法:xml配置文件和动态注解. ...
- python练习题目
1.查看本机安装python版本 2.用python打印"Hello World",给出源代码和执行结果 a.命令行窗口输出(前提:python程序加入PATH系统环境变量) b. ...
- vue调用 Highcharts 实现多个数据可视化展示
一创建一个 options.js 代码为: export const option1 = { bar: { title: { text: '珠海猪场' // 指定图表标题 }, credits: { ...