<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <title></title>

    <script type="text/javascript" src="scripts/jquery.js"></script>

    <script type="text/javascript" src="scripts/jquery-ui.js"></script>

    <script type="text/javascript" src="scripts/jsrender.js"></script>

    <link href="scripts/demos.css" rel="stylesheet" />

    <link href="scripts/movielist.css" rel="stylesheet" />

</head>

<body>

    <script id="movieTemplate" type="text/x-jsrender">

        <td>{{>~format(title, "upper")}}</td>//逗号，和“upper”之间一定要空一格

        <td>{{for  languages}}{{>~format(name, "lower")}}{{/for}}</td>

    </script>

    <table>

        <thead>

            <tr>

                <th>Title</th>

                <th>Languages</th>

            </tr>

        </thead>

        <tbody id="movieList"></tbody>

    </table>

    <script type="text/javascript">

        $.views.helpers({

            format: function (val, format) {

                var ret;

                switch (format) {

                    case "upper": return val.toUpperCase();

                    case "lower": return val.toLowerCase();

                }

            }

        });

        var movie = {

            title: "Eyes Wide Shut",

            languages: [

				{ name: "CHINA" },

				{ name: "FRNDH" },

				{ name: "HDGD" }

            ]

        };

        $("#movieList").html(

            $("#movieTemplate").render(movie)

        );

    </script>

</body>

</html>

　　

JsRender系列demo(9)自定义函数的更多相关文章

  1. JsRender系列demo(3)-自定义容器

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  2. JsRender系列demo(7)compline

    <!DOCTYPE html> <html> <head> <script src="http://code.jquery.com/jquery.j ...

  3. JsRender系列demo(6)-无名

    <!DOCTYPE html> <html> <head> <script src="http://code.jquery.com/jquery.j ...

  4. JsRender系列demo(5) for else

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  5. JsRender系列demo(4)-if else

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  6. JsRender系列demo(2)多模板-template

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  7. JsRender系列demo(1)-insert-data

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  8. PHP函数之自定义函数

    像数学中的函数一样,y=f(x)是函数基本的表达形式,x可看做是参数,y可看做是返回值,即函数定义就是一个被命名的.独立的代码段,它执行特定的任务,并可能给调用它的程序返回一个值. 自定义函数 函数的 ...

  9. Python基础笔记系列九：变量、自定义函数以及局部变量和全局变量

    本系列教程供个人学习笔记使用,如果您要浏览可能需要其它编程语言基础(如C语言),why?因为我写得烂啊,只有我自己看得懂!! 变量在前面的系列中也许就可以发现,python中的变量和C中的变量有些许不 ...

随机推荐

  1. struct和class区别

    转载来源:http://blog.sina.com.cn/s/blog_48f587a80100k630.html C++中的struct对C中的struct进行了扩充,它已经不再只是一个包含不同数据 ...

  2. 【Qt】Qt国际化【转】

    简介 Qt国际化属于Qt高级中的一部分,本想着放到后面来说,上节刚好介绍了Qt Linguist,趁热打铁就一起了解下. 对于绝大多数的应用程序,在刚启动时,需要加载默认的语言(或最后一次设置的语言) ...

  3. 使用MongoDB的开源项目

    根据谷歌的搜索结果筛选出来的. 统计应用 counlty https://count.ly/ mongopress 开源CMS系统 http://www.mongopress.org/ Rubedo ...

  4. 学习php中常用语句与函数

    1.while循环多用于不清楚循环次数的情况下,如需要把从数据库中读取出的多条记录(不清楚到底有多少条)并且要根据某个字段的值进行分类,每类值的具体数目,如下图: 其中选项有三种值,对每个值的票数时行 ...

  5. php + apache + mysql环境搭建

    别人写的很好,若是不改变php默认访问路径的话,能够成功搭建是没问题的 http://www.cnblogs.com/pharen/archive/2012/02/06/2340628.html

  6. Basic Vlan Concepts

    1.  Vlan Benefit ·To reduce CPU overhead on each device by reducing the number of devices that recei ...

  7. 【转】微软MVP攻略 （如何成为MVP？一个SQL Server MVP的经验之谈）

    一.本文所涉及的内容(Contents) 本文所涉及的内容(Contents) 初衷 什么是微软MVP? 成为微软MVP的条件? 如何成为微软MVP? (一) 申请时间划分 (二) 前期准备 (三) ...

  8. mariadb 10 多源复制(Multi-source replication) 业务使用场景分析，及使用方法

    mariadb 10 多源复制(Multi-source replication) 业务使用场景分析,及使用方法 官方mysql一个slave只能对应一个master,mariadb 10开始支持多源 ...

  9. 转字符驱动实例gpio

    概述: 字符设备驱动程序: 是按照字符设备要求完成的由操作系统调用的代码. 重点理解以下内容:  1. 驱动是写给操作系统的代码,它不是直接给用户层程序调用的,而是给系统调用的  2. 所以驱动要向系 ...

  10. CSS3实战之新增的选择器

    用的比较少 看到知道怎么回事就ok http://www.w3.org/TR/css3-selectors/#selectors http://www.cnblogs.com/jscode/archi ...