按列对表行进行排序

阿达因

我在表格中有一个使用地理位置API计算距离的城市列表。我想按距离列自动对表格行进行排序。我试过几个表排序插件,但都失败了。

有什么建议吗?这是我的代码:jsfiddle.net/vLLsLLrb/

表格的外观如下:

在此处输入图片说明

缺口

为了快速做到这一点,我通过执行以下步骤来使用sorttable.js

  • 包括sorttable.js
  • 在表中添加“可排序”类
  • 从数字中删除“ km”(您可以稍后使用css:after再次添加)

基本上,主要是更改表格标签:

        <table id="nearest" class="table table-striped sortable">
            <thead>
                <tr>
                    <th>Destination</th>
                    <th>Distance to</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <th>London</th>
                    <td><span id='london'></span>
                    </td>
                </tr>
                <tr>
                    <th>Newcastle</th>
                    <td><span id='newcastle'></span>
                    </td>
                </tr>
                <tr>
                    <th>Cardiff</th>
                    <td><span id='cardiff'></span>
                    </td>
                </tr>
                <tr>
                    <th>Cambridge</th>
                    <td><span id='cambridge'></span>
                    </td>
                </tr>
                <tr>
                    <th>Reading</th>
                    <td><span id='reading'></span>
                    </td>
                </tr>
            </tbody>
        </table>

就是这样,现在您的距离列旁边还有一个排序三角形!是jsfiddle!

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章