jQuery的tmpl插件的使用

最新推荐文章于 2025-06-16 14:58:06 发布

iteye_6106

最新推荐文章于 2025-06-16 14:58:06 发布

阅读量188

点赞数

分类专栏： jQuery 文章标签： javascript java ViewUI

本文链接：https://blog.youkuaiyun.com/iteye_6106/article/details/82679969

版权

jQuery 专栏收录该内容

7 篇文章

订阅专栏

<%@page language="java" contentType="text/html; charset=GBK" isELIgnored="false"%>
    <!--1.引入插件文件-->
     <script type="text/javascript" src="./common/js/jsTmpl/jquery.js"></script>
     <script type="text/javascript" src="./common/js/jsTmpl/jquery.tmpl.js"></script>
    <!--2.定义模板-->
    <script id="myTemplate" type="text/x-jquery-tmpl">
        <tr>
			<td>\${Name}</td><!--\的作用为转义-->
			<td>\${ID}</td>
		</tr>
    </script>
    
    <!--3.模范JSON返回数据-->
    <script type="text/javascript">
        $(function () {
        	var users = [{ ID: 'think8848', Name: 'Joseph Chan' }, { ID: 'aCloud', Name: 'Mary Cheung'}];
			<!--4.根据模板在指定的元素上加载数据-->
            $("#myTemplate").tmpl([{ ID: 'think8848', Name: 'Joseph Chan' }]).appendTo("#rows");
        });
    </script>
    
    <style type="text/css">
        body
        {
            padding: 10px;
        }
        table
        {
            border-collapse: collapse;
        }
    </style>
    <table cellspacing="0" cellpadding="3" border="1">
        <tbody id="rows">
        	
        </tbody>
    </table>