使用jQuery 插件 tablesorter 的基本使用

<script type="text/javascript" src="script/jquery-1.4.2.min.js" ></script>

<!-- 以下是使用tablesorter 进行排序 但分页不具有排序功能 -->

<script type="text/javascript" src="script/tablesorter/jquery.metadata.js"></script>

<script type="text/javascript" src="script/tablesorter/jquery.tablesorter.min.js"></script>

<link rel="stylesheet" href="script/tablesorter/themes/blue/style.css" type="text/css" id="" media="print, projection, screen" />





<script type="text/javascript">

$(document).ready(function(){

$("#myTable").tablesorter(

{

headers: {3:{sorter: false}, 4:{sorter: false}}

}

);

});

</script>

注: 以上的js都需要引入





<table id="myTable" width="100%" border="0" cellpadding="1" cellspacing="1" class="tablesorter">

<thead>

<tr>

<th>论文名称</th>

<th>完成时间</th>

<th>学生名</th>

<th align="center">论文</th>

<th align="center">附件</th>

</tr>

</thead>

<!-- 列表数据栏 -->

<tbody>





<c:if test="${!empty pm.datas}">

<c:forEach items="${pm.datas }" var="document">

<tr>

<td height="25" width="35%" align="left" valign="middle" >

<a href="actions/zdapproveingAction!documentInfo?document.id=${document.id}&studentId=${document.creator.person.id}" style="color: #3366CC;" >${document.title}</a> </td>

<td height="25" align="left" valign="middle" ><fmt:formatDate value="${document.createTime }" pattern="yyyy-MM-dd"/></td>

<td height="25" align="left" valign="middle" >${document.creator.person.name}</td>

<td height="25" align="center" valign="middle" >

<c:if test="${!empty document.content }">

<a href="actions/declareAction!download?filename=${document.content}" style="color: #3366CC;">下载查看</a>

</c:if>

</td>

<td height="25" align="center" valign="middle" >

<c:if test="${!empty document.otherContent}">

<a href="actions/declareAction!download?filename=${document.otherContent}" style="color: #3366CC;">下载查看</a>

</c:if>

</td>

</tr>

</c:forEach>

</c:if>



</tbody>