废话不说了，直接上代码

<!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. Codevs 2875 RY哥查字典

    时间限制: 1 s  空间限制: 16000 KB  题目等级 : 钻石 Diamond  题目描述 Description RY哥最近新买了一本字典,他十分高兴,因为这上面的单词都十分的和谐,他天天 ...

  2. ASP.NET MVC强制返回XML

    GlobalConfiguration.Configuration.Formatters.Remove(config.Formatters.JsonFormatter);

  3. 模拟n步一维随机游走的情况。

    package randomWalk; import java.util.Random; import java.util.Scanner; public class RandomWalk { pub ...

  4. 使用JDBC从数据库中查询数据

    * ResultSet 结果集:封装了使用JDBC 进行查询的结果 * 1. 调用Statement 对象的 executeQuery(sql) 方法可以得到结果集 * 2. ResultSet 返回 ...

  5. 对session和cookie的一些理解

    由于项目需要,最近用session容器比较多,传载的同时加上了自己的一些理解,不足之处还请大家补充和纠正.);                  response.addCookie(c1);   * ...

  6. c++11: less的用法

    less主要是重载了operator()方法,用来比较lhs 和 rhs std::less::operator() bool operator()(const T &lhs, const T ...

  7. hadoop2.2.0伪分布式搭建

    1.准备Linux环境     1.0点击VMware快捷方式,右键打开文件所在位置 -> 双击vmnetcfg.exe -> VMnet1 host-only ->修改subnet ...

  8. JAVA多线程学习3--线程一些方法

    一.通过sleep方法睡眠 在指定的毫秒数内让当前正在执行的线程休眠(暂停执行).该线程不丢失任何监视器的所属权. 二.线程优先级 线程具有优先级,范围为1-10. MAX_PRIORITY线程可以具 ...

  9. hexo-github 博客搭建

    安装nodejs 从官网下载系统对应的源码 wget -qO- https://raw.githubusercontent.com/creationix/nvm/master/install.sh | ...

  10. URI、URL以及URN的区别

    首先,URI,是uniform resource identifier,统一资源标识符,用来唯一的标识一个资源.而URL是uniform resource locator,统一资源定位器,它是一种具体 ...