日期:2014-05-16  浏览次数:20401 次

用sorttable.js对表格进行排序

今天利用了sorttable.js对表格进行排序,这个js的使用方法非常简单,让我大吃一惊,首先在布局文件的开始导入该js,然后只需要在 table标签添加一个class="sortable"就一切OK了,这样就实现了表格的正反序的排列,不过这样只能使用该js的css了,网上提供了 css的修改方案,修改js红色部分
?if (table.className.search(/\bsortable \b/) != -1) {

v2必须要<table class="sortable" id= "eee">

v2: if (((' '+thisTbl.className+' ').indexOf("sortable ") != -1) && (thisTbl.id) ) {


可是我需要的是一个轻量级的工具,sorttable.js刚好满足我。
官方api:http://www.kryogenix.org/code/browser/sorttable /

使用方法是:

<script src="./include/sorttable.js" type="text/javascript"></script>

典型代码区如下,不支持分页

<table class="tb tb2 sortable">
    <thead>
        <tr>
            <th width="10" class="sorttable_nosort"></th>
            <th width="100">日期</th>
            <th>标题</th>
            <th width="100">类别</th>
            <th width="100">发布者</th>
            <th width="120" class="sorttable_nosort"></th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>内容</td>
            <td>内容</td>
            <td title="">内容</td>
            <td>内容</td>
            <td>内容</td>
            <td>内容</td>
        </tr>
        </tbody>
        <tr>
            <td class="td25"></td>
            <td class="lineheight" colspan="7">当天的发布的消息使用红色主题显示。</td>
        </tr>
</table>

可以看到 class="sorttable_nosort"表示不对该列排序。

大小: 9.53 K
尺寸: 402 x 173
浏览: 45 次
点击打开新窗口浏览全图

?

?