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. poj 1067 取石子游戏(威佐夫博奕(Wythoff Game))

    这里不在详细介绍威佐夫博弈论 简单提一下 要先提出一个名词“奇异局势”,如果你面对奇异局势则必输 奇异局势前几项(0,0).(1,2).(3,5).(4,7).(6,10).(8,13).(9,15) ...

  2. Java对文件及文件夹的操作

    public class FileOperater { // 验证字符串是否为正确路径名的正则表达式 private static String matches = "[A-Za-z]:\\ ...

  3. spingMVC<1>-xml文件配置

    ---恢复内容开始---

  4. 【转】不得不看的两次从C++回归C的高手评论C++

    不得不看的两次从C++回归C的高手评论C++ Linux之父炮轰C++:糟糕程序员的垃圾语言 Linux之父话糙理不糙 不得不看的两次从C++回归C的高手评论C++ C语言是否该扔进垃圾桶 为什么每个 ...

  5. Linux命令sed

    如果一个文本文件数据比较多,大概有40万条数据,我想取出第500-1000条数据,保存到另一个文件,用linux命令该如何操作? sed -n '500,1000p' 41w.txt > new ...

  6. mysql 的设置

    网上的一些文章都已经比较老了,现在版本高了之后,其实配置是很省力的(不考虑什么负载的话) 分享全过程,出了文中提到的安装epel rpmfushion 源指令不同外,其他的过程也适用与Centos 5 ...

  7. 压缩js和css, IIS开启Etags, IIS开启Gzip

    我们在前端页面性能调优时,经常会压缩js和css,下面列出几个比较好用的在线工具. http://www.jb51.net/tools/jsmin/index.htm http://javascrip ...

  8. index and polymorphic

    http://guides.rubyonrails.org/association_basics.html#polymorphic-associations class CreateStars < ...

  9. 正则匹配之url的匹配

    通过这几天的学习,已经对正则有所了解了. 下面动手写一个匹配url的正则吧. <?php $str="http://www.baidu.com"; $reg="/( ...

  10. 谷歌浏览器 DEV Tools

    谷歌浏览器如今是Web开发者们所使用的最流行的网页浏览器.伴随每六个星期一次的发布周期和不断扩大的强大的开发功能,Chrome变成了一个必须的工具.大多数可能熟悉关于chorme的许多特点,例如使用c ...