兩種方法實現性別的判定


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}}即可。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM