javascript视图模板2.0

来源:网络 责任编辑:栏目编辑 发表时间:2013-07-01 20:22 点击:

最近根据项目中的实际的问题,对原有模板进行了一些调整,修复了在复杂嵌套情况下的BUG

数据会分成3部分存放
this._tmp_cache = {}
缓存,通过$cache{value,key}设置

this.params = {}
所有参数,包括callbackObj + 自定义的参数

this.self_params = {}
自定义的参数


(注:callbackObj属于数据层的对象,但有时也许会想在基础上加上自己的参数,自定义参数与callbackObj同名,则会覆盖callbackObj)

从后台请求回来的数据比如是
Javascript代码 
var data = { 
    name : "cc", 
    desc : "    dddddd    ", 
    deschtml : "<a href=''>ddddd</a>", 
    href : "我是谁", 
    playtime : 100, 
    today : '2011-09-05 01:00:00', 

 

Javascript代码 
//str3为模板 
var t = new Template(str3,{ 
    //自定义属性 
    category : "haha", 
    //自定义函数 
    sum : function(){ 
        //arguments全部是字符串,得自己转化类型 
        return eval( [].slice.apply(arguments).join("+")) 
    } 
}); 

 

${name}   显示为   cc
说明:其他所有(如:$trim,$date,$f_,$encode)都会走这个接口
实现:直接从this.params或this._tmp_cache里面寻找,如果找到就返回数据,否则原样输出(输出为 name 而不是cc)

$trim{ desc }   显示为  dddd
说明:trim函数,去掉两边空格

$trim{ deschtml ,html}   显示为  dddd
说明:清空标签,只显示内容,第二个参数暂时只能是'html'

$encode{ href }  显示为   %E6%88%91%E6%98%AF%E8%B0%81
说明:相当于encodeURIComponent函数

$time{ playtime }  显示为  00:01:40
说明:计算数据,会转为  小时:分钟:秒 这样的格式
异常:
error(lib.TemplateNew.evaluate): time format is incorrect") 数据的格式不对

$date{ today ,YY MM DD  hh_mm_ss}  显示为  2011 09 05 01_00_00
说明:将时间格式化
      YYYY/YY 年 ,  MM 月   , DD 日  ,  hh 小时  ,  mm 分钟  ,  ss 秒
异常:
error(lib.TemplateNew.evaluate): date format is incorrect  第一个参数格式不对
error(lib.TemplateNew.evaluate): date format argument[1] is null 第二个参数格式不对

$fixed{asdjfkajskldjflk,2}  显示为  as
说明:data里面没有asdjfkajskldjflk,就会直接原样输出(asdjfkajskldjflk),第二个参数决定截取几个字符,相当月substring

$fixed{asdjfkajskldjflk} 显示为 asdjfkajskldjflk
说明:相当于${asdjfkajskldjflk},这么处理是用了容错,还是建议${..}

$pick{1,2,是,不是}  显示为  不是
说明:相当于  1 == 2 ? 是 : 不是

$pick{1 < 2,是,不是}  显示为  是
说明:相当于  eval("1 < 2") ? 是 : 不是

$pick{1 < 2,对了}  显示为  对了
说明:相当于  eval("1 < 2") ? 是 : ""
异常:
error(lib.TemplateNew.evaluate): the parameter num is incorrect  参数个数不正确


$cache{http://www.xxxx.com?name=${name}&&desc=$trim{desc},url}  不显示
说明:$cache是不返回任何字符的,但这函数是干嘛的呢?假设有下面这种需求

"<a href='http://www.xxxx.com?name=${name}&&desc=$trim{desc}'>地址1</a>"
"<a href='http://www.xxxx.com?name=${name}&&desc=$trim{desc}'>地址2</a>"

如果有N个这种连接,是不是要写N个,而且替换起来也不方便,解决方法:

$

    相关新闻>>

    发表评论
    请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
    用户名: 验证码:点击我更换图片
    最新评论 更多>>

    推荐热点

    • Gb2312转utf-8编码的方法(vbs+js)
    • 如何使用Ajax技术开发Web应用程序(1)
    • js跳转路径问题
    • JavaScript模仿桌面窗口
    • 用js检测两个线段是否相交
    • 我知道的JavaScript -- 设计模式(桥接)应用之 – 验证器
    • 运用JavaScript构建你的第一个Metro式应用程序(on Windows
    • 我是如何去了解jquery的(六),案例之幻灯片轮换
    • Jquery封装幻灯片效果
    网站首页 - 友情链接 - 网站地图 - TAG标签 - RSS订阅 - 内容搜索
    Copyright © 2008-2015 计算机技术学习交流网. 版权所有

    豫ICP备11007008号-1