<!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. Log4Net总结

    Log4Net是用来记录日志的,可以将程序运行过程中的信息输出到一些地方(文件.数据库.EventLog等),日志就是程序的黑匣子,可以通过日志查看系统的运行过程,从而发现系统的问题.日志的作用:将运 ...

  2. 随便写了一个DAO

    package com.java; public class ExamStudent { /** * 流水号 */ private int flowId; /** * 四级.六级 */ private ...

  3. Viewport Resizer下载 谷歌前端自适应开发工具

    原文链接:http://www.phpbiji.cn/article/index/id/107/cid/6.html Viewport Resizer下载 谷歌前端自适应开发工具 在前端开发过程中,随 ...

  4. 《Linux系统 date、cal、hwclock时间命令的用法》

    date命令的用法: [root@apache ~]# date //查看当前系统的时间 Sat Jun 14 13:46:02 CST 2014 [root@apache ~]# date -s & ...

  5. Win7在CMD命令行中使用管理员权限运行命令

    使用命令: runas /user:administrator 需要执行的命令 如下:

  6. Entity Framework 并发处理借鉴

    如下博客 http://www.cnblogs.com/Bce-/p/3725868.html

  7. Sql 临时表

    一个#是只能在当前打开滴查询窗体查询,两个#是能够在其他打开滴查询窗体查询 SELECT 'VR001839003YP' 列名1,'RO512498726DE' 列名2 INTO #临时表 UNION ...

  8. jquery.min.map详见

    温故而知新,翻出来阮前辈的文章记录一下 日期:2013年1月23日 上周,jQuery 1.9发布. 这是2.0版之前的最后一个新版本,有很多新功能,其中一个就是支持Source Map. 访问 ht ...

  9. AIX 中 Paging Space 使用率过高的分析与解决

    AIX操作系统中Paging Space是很重要的设备,当系统中Paging Space使用率过高.系统内存不足时,将影响系统的整体性能,甚至会造成系统的挂起.针对这种情况,通常可以靠增加Paging ...

  10. Ubuntu下Apache+php+mysql网站架设详解

    目录 1 基础 2 安装 2.1 安装LAMP 2.2 图形化管理软件(可选) 2.2.1 安装webmin 2.2.2 安装phpmyadmin 3 配置文件路径 3.1 常用命令 3.2 配置ap ...