废话不说了，直接上代码

<!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. 洛谷 P3368 【模板】树状数组 2

    题目描述 如题,已知一个数列,你需要进行下面两种操作: 1.将某区间每一个数数加上x 2.求出某一个数的和 输入输出格式 输入格式: 第一行包含两个整数N.M,分别表示该数列数字的个数和操作的总个数. ...

  2. 3月3日(5) Roman to Integer

    原题 Roman to Integer 题意很简单,把Roman字母翻译成int. 实现方式也不难,针对每个字符转成int,从右往左,依次判断,如果当前值比上一个值大则相加,小则相减. 什么,你问我怎 ...

  3. 添加远程链接MySQL的权限

    mysql> grant 权限1,权限2,…权限n on 数据库名称.表名称 to 用户名@用户地址 identified by ‘连接口令’; 权限1,权限2,…权限n代表select,ins ...

  4. Google Ajax Library API使用方法(JQuery)

    Google Ajax Library API使用方法 1.传统方式: <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7. ...

  5. [DevExpress]ChartControl之时间轴示例

    关键代码: using System; using System.Data; using System.Windows.Forms; using DevExpress.XtraCharts; name ...

  6. PHP 登录完成后如何跳转上一访问页面

    访问网站页面时,有的页面需要授权才能访问,这时候就会要求用户登录,跳转到登录页面login.php,怎么实现登录后返回到刚才访问的页面 项目需求 访问网站页面时,有的页面需要授权才能访问,这时候就会要 ...

  7. CLR via C# 内存管理读书记

    1. CLR 垃圾回收采用基于代的机制, 在一次垃圾回收中存活下来的对象被提升到另一代 2. 在确认对象是否垃圾时,从一组根开始,根包括静态字段,方法参数,局部变量等 3. 使用CriticalFin ...

  8. jQuery实现分页

    转载地址 http://www.cnblogs.com/xiaoruoen/archive/2012/01/11/2318199.html ;( function($){ $.extend({ &qu ...

  9. 利用ajax在javascript中获取后台的值

    <script type="text/javascript"> function login() { var sa = WebForm1.Hello().value; ...

  10. Html.TextBoxFor三元判断

    @Html.TextBoxFor(item => item.DiscountOW,(Model.TripType == "单程" || (Model.TripType == ...