1. <!DOCTYPE html>
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <title></title>
  6. <script type="text/javascript" src="scripts/jquery.js"></script>
  7. <script type="text/javascript" src="scripts/jquery-ui.js"></script>
  8. <script type="text/javascript" src="scripts/jsrender.js"></script>
  9. <link href="scripts/demos.css" rel="stylesheet" />
  10. <link href="scripts/movielist.css" rel="stylesheet" />
  11. </head>
  12. <body>
  13. <script id="movieTemplate" type="text/x-jsrender">
  14. <td>{{>~format(title, "upper")}}</td>//逗号,和“upper”之间一定要空一格
  15. <td>{{for languages}}{{>~format(name, "lower")}}{{/for}}</td>
  16. </script>
  17. <table>
  18. <thead>
  19. <tr>
  20. <th>Title</th>
  21. <th>Languages</th>
  22. </tr>
  23. </thead>
  24. <tbody id="movieList"></tbody>
  25. </table>
  26.  
  27. <script type="text/javascript">
  28.  
  29. $.views.helpers({
  30. format: function (val, format) {
  31. var ret;
  32. switch (format) {
  33. case "upper": return val.toUpperCase();
  34. case "lower": return val.toLowerCase();
  35. }
  36. }
  37. });
  38.  
  39. var movie = {
  40. title: "Eyes Wide Shut",
  41. languages: [
  42. { name: "CHINA" },
  43. { name: "FRNDH" },
  44. { name: "HDGD" }
  45. ]
  46. };
  47.  
  48. $("#movieList").html(
  49. $("#movieTemplate").render(movie)
  50. );
  51. </script>
  52. </body>
  53. </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. Qt学习总结-ui篇

    控件设置透明度: QGraphicsOpacityEffect *effect = new QGraphicsOpacityEffect(this); effect->setOpacity(0. ...

  2. 【风马一族_windom】 批量修改相同文件类型的后缀

    难题:有时因为某种原因,修改一堆文件的类型,重复操作次数多,浪费时间也跟着多,收获也会相当少. 提问:对于软件而言,可量化的,有规律的操作,可以使用程序来进行替代. 特性:在微软操作系统上,不同后缀的 ...

  3. “==”,比较的是引用 “equals方法”比较的是具体内容

    package com.java1234.chap03.sec08; public class Demo2 { public static void main(String[] args) { //“ ...

  4. background-clip 背景图片做适当的裁剪

    background-clip 用来将背景图片做适当的裁剪以适应实际需要. 语法: background-clip : border-box | padding-box | content-box | ...

  5. Ubuntu 14.04下java开发环境的搭建--3--Tomcat及MySQL的安装

    前面两篇文章,已经说明了JDK和Eclipse 的安装方法,下面简单说一下,Tomcat及MySQL的安装方法. Tomcat的安装. 在合适的地方解压apache-tomcat-6.0.39.tar ...

  6. LLVM language 参考手册(译)(2)

    调用约定(Calling Conventions) LLVM functions, calls and invokes 可以带有一个可选的调用约定来指明调用方式.每一对 caller/callee(调 ...

  7. 两个Activity之间的交互startActivityForResult的使用

    代码如下: package com.zzw.teststartintentforrequest; import android.app.Activity; import android.content ...

  8. SQL Server 本地语言版本

    要一些实验是往往喜欢使用英文的Windows 以及SQL Server ,但有时需要使用中文的环境方便理解.中文的SQL Server 不能被安装在英文的Windows 系统上. 根据文档可得知以下兼 ...

  9. iOS的SandBox的结构研究

    在模拟器中运行iOS程序,都会为该程序创建一个沙盒(SandBox).首先声明,我用的系统是Max OS X 10.7.3,编译器是Xcode 4.3.2.想要找到沙盒目录,先运行Finder,然后在 ...

  10. CP="CAO PSA OUR" 用P3P header解决iframe跨域访问cookie

    1.IE浏览器iframe跨域丢失Session问题 在开发中,我们经常会遇到使用Frame来工作,而且有时是为了跟其他网站集成,应用到多域的情况下,而Iframe是不能保存Session的因此,网上 ...