Jquery tmpl 模板

最新推荐文章于 2025-08-18 20:17:18 发布

weixin_33961829

最新推荐文章于 2025-08-18 20:17:18 发布

阅读量155

点赞数

文章标签： javascript ViewUI

本文介绍如何使用jQuery模板引擎实现数据绑定。通过实例演示了基本的使用方法，包括数据与HTML元素的结合，并展示了如何对输出内容进行HTML编码及在模板中调用自定义JavaScript函数。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Tmpl</title>
<meta name="keywords" content="Tmpl" />

<script src="http://common.cnblogs.com/script/jquery.js" type="text/javascript"></script>  

<script src="http://ajax.aspnetcdn.com/ajax/jquery.templates/beta1/jquery.tmpl.js" type="text/javascript"></script> 
</head>
<body>

<script>
$(function(){

$.tmpl($("#H").html(),
[{"Name":"rhythmk1","Age":"12"},
{"Name":"rhythmk2","Age":"12"},
{"Name":"rhythmk3","Age":"12"},{"Name":"rhythmk4","Age":"12"},
{"Name":"rhythmk5","Age":"12"},
{"Name":"rhythmk6","Age":"12"},{"Name":"rhythmk7","Age":"12"}]
).appendTo("#PageContent");

$("#H").hide();

})
</script>

<ul id="PageContent">
<li>Age</li>
<li>Name</li>
</ul>
<ul id="H">
<li>${Age}</li>
<li>${Name}</li>
</ul>

</body>
</html>