我正在尝试使用tinysort对我的表客户端进行排序,我也使用bootstrap来响应 吼叫是我的桌子
<table id="issues" class="table table-condensed">
<thead>
<tr>
<th data-order="asc">#</th>
<th data-order="asc" class="hidden-xs">Application</th>
<th data-order="asc">Error</th>
<th data-order="desc" class="text-right hidden-xs">Occurences</th>
</tr>
</thead>
<tbody>
<tr data-id="77">
<td class="id">77</td>
<td class="application hidden-xs">my site is this 1</td>
<td class="message">
<span class="hidden-sm hidden-md hidden-lg small">my site is this 1</span>
<a href="www.google.com">null value returned</a></td>
<td class="occurences hidden-xs text-right">3742</td>
</tr>
<tr data-id="5685">
<td class="id">5685</td>
<td class="application hidden-xs">my site is this 2</td>
<td class="message">
<span class="hidden-sm hidden-md hidden-lg small">my site is this 2</span>
<a href="www.google.com">no value present</a></td>
<td class="occurences hidden-xs text-right">235</td>
</tr>
<tr data-id="547">
<td class="id">547</td>
<td class="application hidden-xs">my site is this 3</td>
<td class="message">
<span class="hidden-sm hidden-md hidden-lg small">my site is this 3</span>
<a href="www.google.com">value returned</a></td>
<td class="occurences hidden-xs text-right">14</td>
</tr>
</tbody>
</table>
而贝娄是我的Javascript
var table = document.getElementById('issues')
,tableHead = table.querySelector('thead')
,tableHeaders = tableHead.querySelectorAll('th')
,tableBody = table.querySelector('tbody')
;
tableHead.addEventListener('click',function(e){
var tableHeader = e.target
,textContent = tableHeader.textContent
,tableHeaderIndex,isAscending,order
;
while (tableHeader.nodeName!=='TH') {
tableHeader = tableHeader.parentNode;
}
tableHeaderIndex = Array.prototype.indexOf.call(tableHeaders,tableHeader);
isAscending = tableHeader.getAttribute('data-order')==='asc';
order = isAscending?'desc':'asc';
tableHeader.setAttribute('data-order',order);
tinysort(
tableBody.querySelectorAll('tr')
,{
selector:'td:nth-child('+(tableHeaderIndex+1)+')'
,order: order
}
);
});
这里的问题是,当我使用“错误”头进行排序时,它正在使用Span对行进行排序,这对于小型,中型和&amp;大与小仅在超小型设备中可见。
因此,当我从桌面排序时,它仍然使用该范围进行排序。
我想要做的是它不应该使用该范围对其进行排序,但它应该使用链接进行排序,而在小,中,和大型设备和在超小型设备中使用span进行排序。
这是jsfiddle