两种方法实现性别的判定

template.helper(name, callback)

name:必传,辅助事件的名称。

callback:必传,辅助事件的回调函数。

return:undefined

所谓的辅助事件,主要用于处理一些参数。

例如:性别,我们通常存储0和1来表示女和男,但是界面其实要展示的是“女”和“男”字符串信息。

1、使用helper()方法来实现男女的展示:

<div id="user_info"></div>
<script src="../js/template.js" type="text/javascript" charset="utf-8"></script>
<script type="text/html" id="user_tmpl">
    <div>姓名:<span>{{name}}</span></div>
    <div>性别:<span>{{sex | getSexName}}</span></div>
    <div>学校:<span>{{school}}</span></div>
</script>
<script type="text/javascript">
    var data = {
        name: "小明",
        sex: 1,
        school: "新华小学"
    };
    template.helper("getSexName", function(data) {
        if (data == "0") {
            return "";
        } else {
            return "";
        }
    });
    var user = template("user_tmpl", data);
    document.getElementById("user_info").innerHTML = user;
</script>

由示例可以看出,辅助事件是在调用渲染函数前定义的,使用的写法为{{参数的值 | 辅助事件名称}}。

2、采用artTemplate.js的if语法实现:

<div id="user_info"></div>
<script src="../js/template.js" type="text/javascript" charset="utf-8"></script>
<script type="text/html" id="user_tmpl">
    <div>姓名:<span>{{name}}</span></div>
    <div>性别:<span>{{if sex==0}}女{{else}}男{{/if}}</span></div>
    <div>学校:<span>{{school}}</span></div>
</script>
<script type="text/javascript">
    var data = {
        name: "小明",
        sex: 1,
        school: "新华小学"
    };
    var user = template("user_tmpl", data);
    document.getElementById("user_info").innerHTML = user;
</script>

从例子我们看出,if是需要开始和结束的,如果有其他条件判定,则直接使用{{else}}即可。

转载于:https://www.cnblogs.com/xiaoyucoding/p/5556608.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值