它是一个基于jquery的模板展示插件，有了它就可以去展示JSON数据渲染到HTML页中！
一.使用方法
引入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的更多相关文章

  1. jquery tmpl 详解

    官方解释对该插件的说明:将匹配的第一个元素作为模板,render指定的数据,签名如下: .tmpl([data,][options]) 其中参数data的用途很明显:用于render的数据,可以是任意 ...

  2. artTemplate里一个比不上jQuery tmpl模板的地方就是放一个数组进去它不会自动循环.

    artTemplate里一个比不上jQuery tmpl模板的地方就是放一个数组进去它不会自动循环.

  3. jquery.tmpl.js 模板引擎用法

    1.0 引入: <script src="/js/jquery.tmpl.min.js"></script> 2.0 模板: <script type ...

  4. MVC - 11（下）jquery.tmpl.js +ajax分页

    继续 mvc-11(上).dto:http://www.cnblogs.com/tangge/p/3840060.html jquery.tmpl.js 下载:http://pan.baidu.com ...

  5. jquery tmpl遍历

    最近发现大家用模板渲染一些顺带逻辑功能代码块时,用jquery tmpl较多,遇到了一些问题,现在就个人以前研究过的一切常用功能作介绍,主要针对遍历,其它的大家可以自行浏览一起网站,如:http:// ...

  6. jQuery tmpl用法总结

    之前很是头疼循环数据的渲染,搞一大堆的命名,一点点的赋值,很是麻烦,今天学习了一下jQuery插件tmpl,下面抛出一些使用方法,供以后参考: 官方网址:http://web.archive.org/ ...

  7. JQuery.tmpl()的用法

    动态请求数据来更新页面是现在非常常用的方法,现在通过Ajax请求返回的数据更多的是json对象, 为了解决js动态拼接数据这方面的问题,JavaScript 也可以利用模版来解决这些问题,比如基于 j ...

  8. jQuery .tmpl() 用法

    动态请求数据来更新页面是现在非常常用的方法,比如博客评论的分页动态加载,微博的滚动加载和定时请求加载等. 这些情况下,动态请求返回的数据一般不是已拼好的 HTML 就是 JSON 或 XML,总之不在 ...

  9. 让jquery.tmpl.js支持index序号

    在写Web程序时,想简单处理会使用JS模板,常用的是Jquery的jquery.tmpl.js插件.整个插件还是比较好用的,后续有机会结合实际应用案例,分享下应用方法. 本次文章想分享的一点是其中的一 ...

  10. jquery.tmpl.min.js--前端实现模版--数据绑定--详解

    动态请求数据来更新页面是现在非常常用的方法,比如博客评论的分页动态加载,微博的滚动加载和定时请求加载等. 这些情况下,动态请求返回的数据一般不是已拼好的 HTML 就是 JSON 或 XML,总之不在 ...

随机推荐

  1. 十分钟了解HTTPS

    一.为什么要用HTTPS——HTTP协议的缺陷 通信使用明文(不加密),内容可能会被窃听 不能验证通信方的身份,所以请求和响应都有可能是攻击者发送的 数据包在由A到B的过程中,可能经历很多次路由转发, ...

  2. 变量前缀__device__以及__managed__

    1.__device__ 作为变量前缀时,__device__限定符声明位于设备上的变量.如果此限定符单独使用,则变量具有以下特征: a.位于全局存储器空间中: b.与应用程序具有相同的生命周期: 可 ...

  3. ftp无法上传问题

    1.背景 ftp服务端和客户端一直未做任何改动,无法上传属于突发状态,除此客户端外其他客户端上传正常 客户端(SunOS系统)可以正常连接ftp的xxx21端口,但是传输数据(文件)时无法正常传输 上 ...

  4. Android应用程序支持不同屏幕（尺寸、密度）

    how to build a user interface using Android layouts for all types of devices 使用Android布局设计的UI接口用于不同的 ...

  5. 微信跳转ticket值怎么得到?浏览器跳到微信?哪里有微信跳转接口?跳转功能能用多久?

    目前很多实用微信跳转技术的电商朋友,网站文章头部或者文章中部出现了点击关注微信关注的二维码,用户点击进去直接跳转到微信内打开指定的二维码,识别即可关注,方便省事,比以往的一键复制—粘贴微信号,转化效果 ...

  6. JS的常用属性

    JS-------定义:基于事件和对象驱动,并具有安全性能的脚本语言. 引入:<script  type=”text/javascript”>具体js代码</script>   ...

  7. Express安装

    安装Express 安装好node.js的前提下,再来安装Express. 1.按win+rR,打开“运行”对话框,输入:“cmd”. 2.需要创建一个目录,然后进入目录并作为当前工作目录. mkdi ...

  8. KindEditor富文本编辑器， 从客户端中检测到有潜在危险的 Request.Form 值

    在用富文本编辑器时经常会遇到的问题是asp.net报的”检测到有潜在危险的 Request.Form 值“一般的解法是在aspx页面   page  标签中加上 validaterequest='fa ...

  9. sql查询优化策略

    Sql语句执行顺序: 查询的逻辑执行顺序 (1) FROM left_table (3) join_type JOIN right_table (2) ON join_condition (4) WH ...

  10. ios日期显示NaN

    ios中js通过getMonth()获取到的日期显示NaN,而在其他地方如pc.安卓都是ok的,这是为什么呢,原来这里有个ios的兼容问题,需要将日期中的“-”替换为“/” var time = ne ...