jtemplates + tablesorter--- 实现HTML中一个简单的可按列排序table

最近碰巧需要自己实现一个简单的web页面，要求单击页面表格的每个表头可按列排序。

把几个关键点记下来，大家若有需要可针对改进：

主要用到如下三个js:
<script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="js/jquery-jtemplates.js"></script>
<script type="text/javascript" src="js/jquery.tablesorter.min.js">

<div id="testDiv"></div>
<textarea id="testTemplate" style="display:none">
<table class="zebra-striped" id="testTable" border="1" style="border-collapse:collapse">
<thead><tr><th class="Header headerSortDown">Name</th><th class="header">Age</th></tr></thead>
<tbody>
{#foreach $T as item}
<tr><td>{$T.item.name}</td><td>{$T.item.age}</td></tr>
{#/for}
</tbody>
</table></textarea>

<script type= "text/javascript">
var testInfo = [{"name":"tom","age":"20"},{"name":"Jack","age":"30"},{"name":"Nancy","age":"26"}];
$("#testDiv").setTemplateElement("testTemplate");
$("#testDiv").processTemplate(testInfo);
$(document).ready(function() { $("#testTable").each(function(i) { $(this).tablesorter({ sortList: [[0,1]], headers: {2: { sorter: 'timestr'}}}); });});
</script>