jquery tmpl续

输出html标签内容
格式：{{html 名字}}

DEMO：

<!DOCTYPE html>
<html>
    <head>
        <title>jquery tmpl</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <script src="js/jquery-1.8.1.min.js"></script>
        <script src="js/jquery.tmpl.min.js"></script>
        <script src="js/jquery.tmplPlus.min.js"></script>
    </head>
    <body>
        <div id="test"></div>
        <script id="testTemplate" type="text/x-jquery-tmpl">
            <h3>${title}</h3>
            <ul>
                {{each arr}}
                <li><a href="${src}">{{html txt}}</a></li>
                {{/each}}
            </ul>
            {{html content}}
        </script>
        <script>
            var data = [{"src":"http://www.cnblogs.com/kuikui","txt":"<div style='color:#FF0000;'>博客-测试一</div>"},{"src":"http://www.cnblogs.com/kuikui","txt":"博客-测试二"},{"src":"http://www.cnblogs.com/kuikui","txt":"博客-测试三"}];
            var obj = {"title":"标题","arr":data,"content":"<div>测试<br/><a href='http://www.cnblogs.com/kuikui' target='_blank'>测试</a></div>"};
            $("#testTemplate").tmpl(obj).appendTo("#test");
        </script>
    </body>
</html>

 

posted @ 2013-01-27 23:44  前端咖  阅读(311)  评论(0)  编辑  收藏  举报