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. RecyclerView的使用方法

    1.添加.jar包 File -> Project-Structure -> 左下角 “app” -> Dependencies -> 右上角“+” -> File de ...

  2. Spring IoC、DI入门小程序

    Alt+/智能提示xml配置文件节点及属性:在接口上使用Ctrl+T可以提示其实现类 一.IoC控制反转(将创建对象的权利交给spring)入门小程序 1.引入jar包 2.工程基本结构 3.新建Us ...

  3. 简单了解Hibernate核心API

    一.SessionFactory 1.它代表的是数据库的连接,其实就是在hibernate.cfg.xml文件中的配置信息 2.可以预定义SQL语句 3.SessionFactory是线程安全的,它维 ...

  4. java可变参数例子:求学生成绩信息,不确定课程数

    可变参数特点: 1)...只能出现在参数列表的最后2)...位于变量类型和变量名之间3)调用可变参数的方法时,编译器为该可变参数隐含创建一个数组,在方法体中以数组的形式访问可变参数 //可变参数也可用 ...

  5. Yii2事件

    namespace app\components; use yii\base\Component; use yii\base\Event; class MessageEvent extends Eve ...

  6. Linux时间不准确的问题![转]

    Linux时间不准确的问题![转] 安装完系统发现时间与现实时间相差+8小时,经分析由以下产生.我们在安装时选择的是上海,而centos5把bios时间认为是utc时间,所以+8小时给我们.这个时候的 ...

  7. MYSQL例题合集

    一.数学函数 数学函数主要用于处理数字,包括整型.浮点数等. ABS(x) 返回x的绝对值 SELECT ABS(-1) -- 返回1 CEIL(x),CEILING(x) 返回大于或等于x的最小整数 ...

  8. 直接拿来用!超实用的Java数组技巧攻略

    java编程语言经验分享 摘要:本文分享了关于Java数组最顶级的11大方法,帮助你解决工作流程问题,无论是运用在团队环境或是在私人项目中,你都可以直接拿来用. 本文分享了关于Java数组最顶级的11 ...

  9. [Effective JavaScript 笔记]第5章:数组和字典--个人总结

    前言 这节里其实一直都在讨论对象这个在js中的万能的数据结构.对象可以表式为多种的形式,表示为字典和数组之间的区别.更多的我觉得这章讨论多的是一些对应实现功能的相关操作,有可能出现的bug以及如何避免 ...

  10. Xen虚拟机克隆实战

    导读 在我们使用Xen虚拟化的时候,会经常创建虚拟机(VM),每次安装创建步骤比较繁琐,本文介绍通过virt-clone命令克隆xen虚拟机实战. 查看virt-clone命令是否存在 rpm -qa ...