这是我的 jQuery tablesorter 代码:
<script type="text/javascript">
$(document).ready(function() {
$("#sorttable").tablesorter()
.tablesorterPager({ container: $("#pagerOne"), positionFixed: false })
});
</script>
数据是这样的:
14.6km,about:21 mins
12.6km,about:41 mins
9.6km,about:15 mins
5.6km,about:5 mins
140.6km,about:3 hours 21 mins
如上，如何对上述类型的数据进行排序，请给我任何解决方案。
问题是数据没有排序，只是跳转数据。
请帮助解决这个问题。
<table id="sorttable" class="yui" width="580px" style="display: block; ">
<thead><tr><th align="center" class="header headerSortDown"><a href="#" title="Click Header to Sort">sort1</a></th><th align="center" class="header"><a href="#" title="Click Header to Sort">sort2</a></th><th align="center" class="header"> <a href="#" title="Click Header to Sort">sort3</a></th></tr></thead>
<tbody><tr><td><span id="Labe1" style="display:inline-block;color:Sienna;height:30px;width:250px;">993 km,About :14 hours 27 mins</span></td><td align="center" style="width: 150px; "><img id="lblstore1" src="Blue%20hills.jpg" style="height:30px;width:40px;" title="Near Santhi sagar,Koramangala,5 th block,Bangalore,Karnataka "></td><td align="center" style="width: 150px; "><input id="but1" type="button" value="View" style="height:30px;width:75px;" onmouseover="viewmap('lblstorename1')"></td></tr>
<tr><td><span id="Labe10" style="display:inline-block;color:Sienna;height:30px;width:250px;">993 km,About :14 hours 27 mins</span></td><td align="center" style="width: 150px; "><img id="lblstore10" src="Blue%20hills.jpg" style="height:30px;width:40px;" title="2954 23, 2nd Stage, D Block, MKK Road, Rajaji Nagar,Bangalore,Karnataka "></td><td align="center" style="width: 150px; "><input id="but10" type="button" value="View" style="height:30px;width:75px;" onmouseover="viewmap('lblstorename10')"></td></tr>
<tr><td><span id="Labe2" style="display:inline-block;color:Sienna;height:30px;width:250px;">1,003 km,About :14 hours 42 mins</span></td><td align="center" style="width: 150px; "><img id="lblstore2" src="Blue%20hills.jpg" style="height:30px;width:40px;" title="No. 5, 80 ft Road,R T Nagar, Bangalore,Bangalore, "></td><td align="center" style="width: 150px; "><input id="but2" type="button" value="View" style="height:30px;width:75px;" onmouseover="viewmap('lblstorename2')"></td></tr>
<tr><td><span id="Labe3" style="display:inline-block;color:Sienna;height:30px;width:250px;">993 km,About :14 hours 27 mins</span></td><td align="center" style="width: 150px; "><img id="lblstore3" src="Blue%20hills.jpg" style="height:30px;width:40px;" title=" 2, 80FT ROAD,1ST STAGE, 2ND BLOCK, HBR LAYOUT, K.K.HALLI, BANGALOREBANGALORE ,Bangalore, "></td><td align="center" style="width: 150px; "><input id="but3" type="button" value="View" style="height:30px;width:75px;" onmouseover="viewmap('lblstorename3')"></td></tr>
<tr><td><span id="Labe4" style="display:inline-block;color:Sienna;height:30px;width:250px;">993 km,About :14 hours 27 mins</span></td><td align="center" style="width: 150px; "><img id="lblstore4" src="Blue%20hills.jpg" style="height:30px;width:40px;" title="87, HPCL PETROL PUMPRESIDENCY ROAD ,Bangalore, "></td><td align="center" style="width: 150px; "><input id="but4" type="button" value="View" style="height:30px;width:75px;" onmouseover="viewmap('lblstorename4')"></td></tr>
<tr><td><span id="Labe5" style="display:inline-block;color:Sienna;height:30px;width:250px;">993 km,About :14 hours 27 mins</span></td><td align="center" style="width: 150px; "><img id="lblstore5" src="Blue%20hills.jpg" style="height:30px;width:40px;" title="Mats Fuel Park, 123 2, ITPL Road, Brookefields, Kundalahalli, Bangalore - 37,Bangalore, "></td><td align="center" style="width: 150px; "><input id="but5" type="button" value="View" style="height:30px;width:75px;" onmouseover="viewmap('lblstorename5')"></td></tr>
<tr><td><span id="Labe6" style="display:inline-block;color:Sienna;height:30px;width:250px;">1,005 km,About :14 hours 39 mins</span></td><td align="center" style="width: 150px; "><img id="lblstore6" src="Blue%20hills.jpg" style="height:30px;width:40px;" title=" 124 2, C O HPCL PETROL PUMP, BYRASANDRA ROAD, DRDO TOWNSHIP, C V RAMAN NAGAR, BANGALORE ,Bangalore, "></td><td align="center" style="width: 150px; "><input id="but6" type="button" value="View" style="height:30px;width:75px;" onmouseover="viewmap('lblstorename6')"></td></tr>
<tr><td><span id="Labe7" style="display:inline-block;color:Sienna;height:30px;width:250px;">993 km,About :14 hours 27 mins</span></td><td align="center" style="width: 150px; "><img id="lblstore7" src="Blue%20hills.jpg" style="height:30px;width:40px;" title="17 7, SANTOSH PETROL PUMPNEW BEL ROAD, CHIKKAMARANAHALLI ,Bangalore,Karnataka "></td><td align="center" style="width: 150px; "><input id="but7" type="button" value="View" style="height:30px;width:75px;" onmouseover="viewmap('lblstorename7')"></td></tr>
<tr><td><span id="Labe8" style="display:inline-block;color:Sienna;height:30px;width:250px;">1,001 km,About :14 hours 39 mins</span></td><td align="center" style="width: 150px; "><img id="lblstore8" src="Blue%20hills.jpg" style="height:30px;width:40px;" title="No. 6, 100 ft Road,1st Stage,Indiranagar,Bangalore,Karnataka "></td><td align="center" style="width: 150px; "><input id="but8" type="button" value="View" style="height:30px;width:75px;" onmouseover="viewmap('lblstorename8')"></td></tr>
<tr><td><span id="Labe9" style="display:inline-block;color:Sienna;height:30px;width:250px;">993 km,About :14 hours 27 mins</span></td><td align="center" style="width: 150px; "><img id="lblstore9" src="Blue%20hills.jpg" style="height:30px;width:40px;" title="52, HPCL PETROL PUMP15TH CROSS, 1ST PHASE JPNAGAR ,Bangalore,Karnataka "></td><td align="center" style="width: 150px; "><input id="but9" type="button" value="View" style="height:30px;width:75px;" onmouseover="viewmap('lblstorename9')"></td></tr>
</tbody>
<tfoot>
<tr id="pagerOne"><td colspan="7"><img src="JqueryFiles/img/first.png" class="first" alt="img"><img src="JqueryFiles/img/prev.png" class="prev" alt="img"><input type="text" class="pagedisplay"><img src="JqueryFiles/img/next.png" class="next" alt="img"><img src="JqueryFiles/img/last.png" class="last" alt="img"><select class="pagesize"><option selected="selected" value="10">10</option><option value="20">20</option><option value="30">30</option><option value="40">40</option><option value="50">50</option><option value="60">60</option><option value="70">70</option><option value="80">80</option></select></td></tr>
</tfoot>
</table>
这里还有 1,5,10 条记录没有排序......
最佳答案
我不确定您试图对其他列进行排序...如果您想要图像或按钮的自定义排序顺序，您可以使用自定义文本使用它们的属性之一进行排序提取方法。
我假设您的主要目标是按数字距离对行进行排序。为此，请使用自定义解析器提取字符串的第一个单词并在进行数字比较之前删除逗号。
检查 this fiddle有关使用按距离对数据进行数字排序的简化示例。
另见:
关于javascript - jQuery tablesorter 排序不起作用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/11324727/