<!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">

        <tr>

            <td>{{:title}}</td>

            <td>{{for languages}}

                <div class="{{:#index%2 ? 'even' : 'odd'}}"></div>

                <em>{{:name}}</em>

                {{else}}

                No alternate languages!

                {{/for}}</td>

        </tr>

    </script>

    <h2>Using {{for}} to render hierarchical data - inline nested template.</h2>

    <table>

        <thead>

            <tr>

                <th>title</th>

                <th>movieList</th>

            </tr>

        </thead>

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

    </table>

    <script type="text/javascript">

        var movies = [

		{

		    title: "Meet Joe Black",

		    languages: [

				{ name: "English" },

				{ name: "French" }

		    ]

		},

		{

		    title: "Eyes Wide Shut",

		    languages: [

				{ name: "French" },

				{ name: "Mandarin" },

				{ name: "Spanish" }

		    ]

		},

		{

		    title: "The Inheritance",

		    languages: [

				{ name: "English" },

				{ name: "German" }

		    ]

		},

		{

		    title: "Local Story",

		    languages: []

		},

		{

		    title: "My Home Video"

		}

        ];

        $("#movieList").html($("#movieTemplate").render(movies));

    </script>

</body>

</html>

　　

JsRender系列demo(5) for else的更多相关文章

  1. JsRender系列demo(9)自定义函数

    <!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(4)-if else

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

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

    <!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. JsRender系列-11

    <!DOCTYPE html> <html> <head> <script type="text/javascript" src=&quo ...

  9. JsRender系列demo-10

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

随机推荐

  1. Codevs 1097 校门外的树

    时间限制: 1 s   空间限制: 128000 KB   题目等级 : 白银 Silver   题目描述 Description 某校大门外长度为L的马路上有一排树,每两棵相邻的树之间的间隔都是1米 ...

  2. FPGA使用技巧

    1 IOB       为了保证FPGA输入输出接口的时序,一般会要求将输入管脚首先打一拍再使用,输出接口也要打一拍再输出FPGA.将信号打一拍的方法是将信号通过一次寄存器,而且必须在IOB里面的寄存 ...

  3. VIM小技巧之文件名补全

    恩,这两天在看<简明Python教程>,那里面作者建议写代码的时候前面的注释写上文件名,写上调用的解释器,比如这样: 恩,然后我当然不可能每回新建一个文件,就要在开头写上一大串东西啊,vi ...

  4. WP开发笔记——控件倾斜效果

    创建一个基本的 Windows Phone 应用程序并添加 TiltEffect 类文件. 添加要倾斜的控件的分类. 全局应用 IsTiltEnabled 依赖项属性,以便为所有的指定控件提供倾斜功能 ...

  5. DevExpress学习笔记1-ProductsDemo.Win

    最近在学习ProductsDemo.Win,有一些体会记录下来,大家分享: 在Contacts模块: 在Private Sub UpdateCurrentContact()过程添加一句:InitInd ...

  6. OS X EI Capitan安装mcrypt

    OS X EI Capitan安装mcrypt   (我的博客原文:http://www.jmolboy.com/2015/12/01/mcrypt-extension-on-EI-Capitan/) ...

  7. [大牛翻译系列]Hadoop（2）MapReduce 连接：复制连接（Replication join）

    4.1.2 复制连接(Replication join) 复制连接是map端的连接.复制连接得名于它的具体实现:连接中最小的数据集将会被复制到所有的map主机节点.复制连接有一个假设前提:在被连接的数 ...

  8. 高德amap 根据坐标获取的地址信息

    高德地理逆地理编码接口List<List<Address>> lists = coder.getFromLocation(33.00, 116.500, 3, 3, 3, 50 ...

  9. 把数组排成最小的数/1038. Recover the Smallest Number

    题目描述 输入一个正整数数组,把数组里所有数字拼接起来排成一个数,打印能拼接出的所有数字中最小的一个.例如输入数组{3,32,321},则打印出这三个数字能排成的最小数字为321323.   Give ...

  10. Python流程控制

    if语句: --Pyhon中的IF跟其他语言类似,if包含一个逻辑表达式,使用表达式比较,在比较的结果的基础上做出判断 --if expression: statement(s) 注意:Python使 ...