废话不说了，直接上代码

<!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 type="text/html" id="userinfoTemplate">

        {{for Items}}

        <tr><td>{{:name}}</td><td>{{:Age}}</td><td>{{:IsOpen?'结婚':'未婚'}}</td></tr>

        {{/for}}

        <tr>

        </tr>

    </script>

    <table>

        <thead>

            <tr>

                <th>Title</th>

                <th>Languages</th>

            </tr>

        </thead>

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

    </table>

    <table>

        <thead>

            <tr>

                <th>姓名</th>

                <th>年龄</th>

                <th>婚否</th>

            </tr>

        </thead>

        <tbody id="userInfo"></tbody>

    </table>

</body>

</html>

<script type="text/javascript">

    $(function () {

        var data = {

            DataCount: 138,

            PageIndex: 2,

            PageCount: 3,

            Items: [

                { name: "刘建伟", Age: 12, IsOpen: false },

                { name: "小全", Age: 13, IsOpen: true },

                { name: "小刚", Age: 14, IsOpen: false },

                { name: "撞墙", Age: null, IsOpen: false },

                { name: null, Age: 15, IsOpen: true },

                { name: "小娥", Age: 16, IsOpen: false },

                { name: "小娜", Age: 17, IsOpen: false },

            ]

        };

        $("#userInfo").html($("#userinfoTemplate").render(data));

    });

</script>

　　结果显示：

JsRender系列demo-对null 和boolen类型数据的探讨的更多相关文章

  1. JsRender系列demo(7)compline

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

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

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

  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(3)-自定义容器

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

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

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

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

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

  9. Struts2+Jquery实现ajax并返回json类型数据

    来源于:http://my.oschina.net/simpleton/blog/139212 摘要 主要实现步骤如下: 1.JSP页面使用脚本代码执行ajax请求 2.Action中查询出需要返回的 ...

随机推荐

  1. windows phone 8 开发系列（三）程序清单说明与配置

    一 清单文件内容介绍 当我们先建了一个项目之后,我们可以看到vs自动会为我们创建了很多文件,正常人都会先一个个去翻看下每个文件都是干啥的,都主要写了些啥,在这些文件中,在Properies目录下面,我 ...

  2. Android 悬浮窗 WindowManager WindowManager.LayoutParamas

    前方高清大图~~~~ 绘制的图片资源: // draw bitmap BitmapDrawable bmpDraw = (BitmapDrawable) getResources().getDrawa ...

  3. HTML5应用开发：JavaScript库iScroll教程

    目录 1. iScroll介绍 2. 安装和使用 3. 简单的iScroll例子 4. Pinch & Zoom 5. Snap to element 6. iScroll 详细参数 1. i ...

  4. 预处理C#

    1.什么是预处理 源代码指定了程序的定义.预处理(preprocessior directive)指令是指示编译器如何处理源代码.这里的预处理和C,C++里面的预处理是不一样的,在C,C++中有实际的 ...

  5. 动画气泡指示当前滑动值--第三方开源--DiscreteSeekbar

    DiscreteSeekbar在github上的项目主页是:https://github.com/AnderWeb/discreteSeekBar DiscreteSeekbar可以自定制的属性很多, ...

  6. Translation perface: <<Professional JavaScript for Web Developers, 3rd Edition>>

    It is a huge pitty to breaking translating this book. Sincerly speaking, I am striken by this great ...

  7. asp.net 生成PDF方法

    今天转博客园看到有人发表了一篇生成PFd的文章,准备自己也留一份准备以后用到的时候方便调用: 首先去itextsharp网站下载控件(https://sourceforge.net/projects/ ...

  8. js中ajax异步导致的一些问题

    问题1:ajax默认是异步,所以在ajax中对外面定义的变量赋值,不能正确赋值 $("form").submit( var flag; $.ajax({ type: 'GET', ...

  9. R语言基础(二) 可视化基础

    > which.max(apply(x[c("x1","x2","x3")], 1, sum))49 > x$num[which ...

  10. 【img】 图片是怎么存储的

    用ue 打开一张图片,动动手脚,出现卡碟的画面效果. 可不可以用C#来做一个图片编辑器? 怎么做?路线怎么走? 稍后揭晓答案 根据实际操作获取类一些基础知识: 1. 文件是二进制存储的,为了便于查看编 ...