template模板引擎渲染

<div class="problems" id="content">
</div>

<script id="test" type="text/html">
    <div class="problem {{highlight}}" id={{id}} onclick="highlight(this)">{{title}}</div>
</script>
<script src="js/template-web.js"></script>
$.ajax({
	type: 'post',
	url: url,
	dataType: 'json',
	success: function(data) {
		console.log(JSON.stringify(data.list))
		var list = data.list
		$.each(list, function(i, n) {
			var id = n.id;
			var title = n.title;
			var highlight = ''
			if(i == 0) {
				highlight = 'highlight';
			}
			var data = {
				id: id,
				title: title,
				highlight: highlight,
			};
			var html = template('test', data);
            $('#content').append(html);
        });
    },
	error: function() {
		
	}
});
function highlight(e) {
	$(e).addClass('highlight');
	$(e).siblings().removeClass("highlight");
};

猜你喜欢

转载自blog.csdn.net/jjy8040/article/details/89787925