自己写的一个jquery模板引擎(json比较好用)

还是一个未完成的项目,缺乏对if等的支持,希望大家能提供一下参考的意见,让我把它写完

ContractedBlock.gif ExpandedBlockStart.gif js代码部分
 1/// <reference path="jquery-1.3.2-vsdoc.js" />
 2ExpandedBlockStart.gifContractedBlock.gifvar json = "result""success""total"3"page"1"rows": ["QuestionID"45233"QUserName""游客""Question""我80多岁坐轮椅的母亲买了一张首都体育馆看排球的门票,她担心残疾人能否进去看,有没有残疾人看球平台和通道""Answer""您好!我们这里没有代理奥运会门票,您可以通过其他方式查询。感谢您对大麦票务的支持!""QDate""2008-8-18 9:44:20""ADate""2008-8-18 9:48:27" }"QuestionID"39672"QUserName""游客""Question""在左安路到首都体育馆公交几路?""Answer"null"QDate""2008-3-3 10:25:34""ADate"null }"QuestionID"36942"QUserName""游客""Question""西站到北京体育馆公交几路啊\r\n""Answer""您好:从北京西站南广场出发,乘坐122路下行(北京西站东-北京站东),在永定门东换乘36路环线(左安路-左安路),抵达北京体育馆. 约16.41公里就可以抵达北京体育馆。感谢您对中国票务在线的支持!""QDate""2007-12-20 18:05:15""ADate""2007-12-21 9:40:26"}] };
 3ExpandedBlockStart.gifContractedBlock.gif(function($) {
 4ExpandedSubBlockStart.gifContractedSubBlock.gif    jQuery.fn.jsonTemplateEngine = function(jsonData, options) {
 5ExpandedSubBlockStart.gifContractedSubBlock.gif        var setting = jQuery.extend({
 6            exLeft: "<#"//匹配的左边限定符
 7            exRight: "#>"//匹配的右边限定符
 8            tempDate: "TemplateData"//jquery存储data所用的名称
 9            appTo: null//其他需要显示的对象,如果为空,则自身输出
10            showTime: 500,
11ExpandedSubBlockStart.gifContractedSubBlock.gif            callback: function() { } //处理完成后的自定义函数
12        }
, options);
13ExpandedSubBlockStart.gifContractedSubBlock.gif        if (this.size() <= 0 || jsonData.length <= 0return this; }
14        var TemplateHtml;
15ExpandedSubBlockStart.gifContractedSubBlock.gif        if (this.data(setting.tempDate) != undefined) {
16            TemplateHtml = this.data(setting.tempDate);
17        }

18ExpandedSubBlockStart.gifContractedSubBlock.gif        else {
19            TemplateHtml = this.html();
20            this.data(setting.tempDate, TemplateHtml);
21        }

22        var _self = setting.appTo == null ? this : jQuery(setting.appTo); //如果是appTo追加到其他对象里面
23        _self.empty().hide();
24        //针对<,>被编码过后的处理问题
25        TemplateHtml = TemplateHtml.replace(/\&gt;/ig, ">").replace(/\&lt;/ig, "<");
26
27        var specials = ["$""^""?""/"".""*""+""?""|""("")""[""]""{""}""\\"];
28        var escapeRegex = new RegExp("(\\" + specials.join("|\\"+ ")""g");
29        var escapedLeft = setting.exLeft.replace(escapeRegex, "\\$1");
30        var escapedRight = setting.exRight.replace(escapeRegex, "\\$1");
31
32        var re = new RegExp(escapedLeft + "(\\w+)" + escapedRight, "ig");
33        var arr = TemplateHtml.match(re);
34ExpandedSubBlockStart.gifContractedSubBlock.gif        jQuery.each(jsonData, function(i) {
35            var temp = TemplateHtml;
36ExpandedSubBlockStart.gifContractedSubBlock.gif            jQuery.each(arr, function(n) {
37                var obj = arr[n].replace(new RegExp(escapedLeft, "ig"), "").replace(new RegExp(escapedRight, "ig"), "");
38                temp = temp.replace(new RegExp(escapedLeft + obj + escapedRight, "ig"), eval("jsonData[" + i + "]." + obj));
39                //temp = temp.replace(new RegExp(escapedLeft + "\/if[\\s\\S]*?\/end" + escapedRight, "ig"), "11");
40                var funs = temp.match(new RegExp(escapedLeft + "\/if[\\s\\S]*?\/end" + escapedRight, "ig"));
41                alert(funs);
42            }
);
43            _self.append(temp);
44
45        }
);
46ExpandedSubBlockStart.gifContractedSubBlock.gif        if (jQuery.isFunction(setting.callback)) { setting.callback(); } //执行函数
47        _self.show(setting.showTime);
48        return _self;
49    }

50}
)(jQuery);
51
52ExpandedBlockStart.gifContractedBlock.gif$(document).ready(function() {
53    //$("#alert1").click(function() {
54ExpandedSubBlockStart.gifContractedSubBlock.gif        $("#temp").jsonTemplateEngine(json.rows, "callback"function() { $("#output").html(json.total); } });
55    //});
56}
);
ContractedBlock.gif ExpandedBlockStart.gif 页面代码部分
    <div id="temp" style="display:none">
    
<h5><span class="fL"><b><#QUserName#></b> 提问:</span><span class="gray fR">提问于<#QDate#></span></h5>
           
<div class="queCon">
              
<p><#Question#></p>
               
<#/if(<#Answer#>!=null)#><p><#Answer#></p>
               
<#/else#>
               
<class="reaCon">大麦票务客服  回答于<span class="f10"><#ADate#></span></p>
              
</div> <#/end#>
            
</div>
    
 
<div id="alert1" style="margin-left:100px"><href="javascript:void(0)">加载一下</a></div>   
<div id="output"></div>

转载于:https://www.cnblogs.com/lyfeixue/archive/2009/05/05/1449974.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值