jQuery的tmpl插件的使用

<%@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>

猜你喜欢

转载自aclik.iteye.com/blog/2361134
今日推荐