To be or not to be.That is a question!

---源于莎士比亚的《哈姆雷特》

导航

Handlebars 学习1

<!doctype html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
	<script type="text/javascript" src="libs/jquery.js"></script>
	<script type="text/javascript" src="libs/handlebars.js"></script>
</head>
<body>
<script id="demo" type="text/x-Handlebars-template">
{{#list people}}
	{{firstName}} {{lastName}}
{{/list}}
</script>

<div id="temp"></div>
<script type="text/javascript">
var context={
	people:[
		{firstName:"wang",lastName:"wen"},
		{firstName:"Li",lastName:"zenrui"},
		{firstName:"wang",lastName:"zian"}
	]
}
Handlebars.registerHelper("list",function(item,options){
	var out="<ul>";
	for(var i=0,l=item.length;i<l;i++){
		out=out+"<li>"+options.fn(item[i])+"</li>";
	}
	return out+"</ul>";
})

var source=$("#demo").html(),
	template=Handlebars.compile(source);
$("#temp").html(template(context));
</script>
</body>
</html>

最近研究了下handlebars,感觉此模板简单易学 推荐给大家

posted on 2013-04-16 21:29  Ijavascript  阅读(735)  评论(0编辑  收藏  举报