javascript - 如何按正确的顺序选择多行表格标题中的表格单元格？

Question

我有一个这样的标题:

<thead>
   <tr>
     <th rowspan="2">Cell-1</th>
     <th rowspan="2">Cell-2</th>        
     <th colspan="3">Header</th>
     <th rowspan="2">Cell-6</th>
   </tr>
   <tr>
     <th">Cell-3</th>
     <th">Cell-4</th>
     <th">Cell-5</th>
   </tr>
</thead>

我需要创建一个 jquery 选择器，其中的单元格按正确的顺序 1-2-3-4-5-6。现在我的选择器看起来像这样:

hdrCols = thead.find( "tr:first th[rowspan=2], TR:first TH[rowspan=2]").add( thead.find( "tr:last-child th, TR:last-child TH" ) );

这给了我 1-2-6-3-4-5 并破坏了我的布局。

有没有办法创建一个选择器，以正确的顺序获取单元格？我无法移动列，因此任何解决方案都必须包含这一点。

Answer 1

尝试简单地使用 JavaScript sort()功能。像这样:http://jsfiddle.net/6wYQt/

function sortHeaders(a, b) {
    var x = $(a).text().toLowerCase();
    var y = $(b).text().toLowerCase();

    return ((x < y) ? -1 : ((x > y) ? 1 : 0));
}

thead   = $('thead');
hdrCols = thead.find( "tr:first th[rowspan=2], TR:first TH[rowspan=2]").add( thead.find( "tr:last-child th, TR:last-child TH" ) );

hdrCols.sort(sortHeaders);

console.log(hdrCols);
​