jquery 中的tmpl类似于asp.net中的datalist控件。

首选,在页面代码中加入两行,jquery的js文件引用

<script src="http://code.jquery.com/jquery-latest.min.js"></script>

<script src="http://ajax.microsoft.com/ajax/jquery.templates/beta1/jquery.tmpl.min.js"></script>

然后再建一个html模版

<script id="moiveTemplate" type="text/x-jquery-templ">

<li><b>${Name}</b>(${ReleaseYear})</li>

</script>

<script >

var moives=[{Name:"The Red Violin",ReleaseYear:"1998"},{Name:"Eyes Wide Shut",ReleaseYear:"1999"},{Name:"The Inheritance",ReleaseYear:"1976"}];//获得json格式的数据

$("#moiveTemplate").templ(moives).appendTo("#moiveList");

</script>

<ul id="moiveList">

</ul>

效果显示为:

  • The Red Violin (1998)
  • Eyes Wide Shut (1999)
  • The Inheritance (1976)

Jquery的tmpl的更多相关文章

  1. jQuery tmpl用法总结

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

  2. Jquery 模板插件 jquery.tmpl.js 的使用方法(1):基本语法,绑定,each循环,ajax获取json数据

    jquery.tmpl.js 是一个模板js  ,主要有2个方法 (1):$.template()方法,将一段script或者是Html编译为模板,例如 $.template('myTemplate' ...

  3. Jquery.tmpl

     它是一个基于jquery的模板展示插件,有了它就可以去展示JSON数据渲染到HTML页中!一.使用方法引入Jquery引入 tmpl<script src="../Scripts/j ...

  4. jQuery .tmpl(), .template()学习资料小结

    昨晚无意中发现一个有趣的jQuery插件.tmpl(),其文档在这里.官方解释对该插件的说明:将匹配的第一个元素作为模板,render指定的数据,签名如下: .tmpl([data,][options ...

  5. jquery.tmpl的使用

    jquery.tmpl是jQuery模板插件,http://plugins.jquery.com/tmpl/ (另外还有一个插件dot.js,不依赖与jquery,性能更佳,使用方法大同小异) 在网页 ...

  6. jQuery File Upload 单页面多实例的实现

    jQuery File Upload 的 GitHub 地址:https://github.com/blueimp/jQuery-File-Upload 插件描述:jQuery File Upload ...

  7. jquery template模版引擎

    jTemplates http://jtemplates.tpython.com/ jquery-template  https://github.com/codepb/jquery-template ...

  8. jQuery-template.js学习

    花了点时间,看了下jQuery-template.js,不多废话,先上结构 jQuery.each({..},function(){}) jQuery.fn.extend({..}) jQuery.e ...

  9. JavaScript 平时记录

    1,JS中的this 见下面例子,注意函数中的函数 中的this指的是window对象了!!! document.addEventListener('click', function (e) { co ...

随机推荐

  1. Windows 下的.NET+ Memcached安装

    转载请标明出处: http://www.yaosansi.com/ 原文:http://www.yaosansi.com/post/1396.html Memcached官方:http://danga ...

  2. tcpdump 时报ServFail 0/0/1 (97)

    ServFail           结合业务应该是dns   server fail 0/0/1               1/0/0表示机器号/槽位号/子接口号                 ...

  3. LINUX下 my.cnf php.ini的位置

    my.cnf:/etc/ php.in:/usr/local/php/etc/

  4. JS的运行机制

    代码块: JS中的代码块是指由<script>标签分割的代码段.JS是按照代码块来进行编译和执行的,代码块间相互独立(即就算代码块1出错,但不影响代码块2的加载和执行),但变量和方法共享. ...

  5. update操作多张表

    sql 语句多张表UPDATE用法一.当用一个表中的数据来更新另一个表中的数据,T-SQL提供多种写法(下面列出了二种),但建议用第一种写法,虽然传统,但结构清晰.飞.飞Asp技术乐园并且要注意,当用 ...

  6. 杭赛.Triangle(数学推导)

    Triangle Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others) Total S ...

  7. VS2010 使用时选择代码或双击时出错,点击窗口按钮后VS自动重启问题

    VS2010 使用时选择代码或双击时出错崩溃,点击窗口按钮后VS自动重启问题 下载补丁,打上补丁之后,重启电脑,解决了问题. WindowsXP的下载地址:Windows XP 更新程序 (KB971 ...

  8. Android Bitmap 全面解析(四)图片处理效果对比 ...

    对比对象: UIL Volley 官方教程中的方法(此系列教程一里介绍的,ImageLoader的处理方法和官方的差不多) -------------------------------------- ...

  9. nginx(五)nginx与php的安装配置

    经过前面学习,对nginx有个大概的了解,来配置LNMP;只要是在系统安装过程中选择安装比较齐全的包,基本上系统都能满足安装要求,下面是我一个一个测试的,基本上全部安装所需的库文件,放心安装: [ro ...

  10. 对比WDCP面板与AMH面板的区别与选择

    转载: http://www.laozuo.org/2760.html | 老左博客 随着VPS主机的性价比提高(其实就是降价)我们很多站长会越来越多的选择使用VPS搭建网站或者运营一些项目,相比较而 ...