Question

如果我有一个动态创建的表，看起来像这样：

<table id="myTable">
  <tr>
    <th>Day</th>
    <th>Hours</th>
  </tr>
  <tr>
    <td>Weds</td>
    <td>7</td>
  </tr>   
  <tr>
    <td>Fri</td>
    <td>7.5</td>
  </tr> 
  <tr>
    <td>Mon</td>
    <td>8</td>
  </tr>       
</table>

如何在周一至周五订购行？最好使用jQuery。

Answer 1

这使用工作日哈希将三个字母的日缩写转换为数字。行将从表中删除，排序并插回：

var weekHash = {'Sun':0,'Mon':1,'Tue':2,'Wed':3,'Thu':4,'Fri':5,'Sat':6};
var header = $('tr:first');
var days = $('tr').not(header);
var orderedDays = [];
for (var i = 0; i < 7; i++)
{
    days.each(function(){
        if (i == weekHash[$(this).find('td:first').html()])
        {
            orderedDays.push(this);
        }
    });
}
$('tr').not(header).remove;
for (o in orderedDays)
{
    $('table').append(orderedDays[o]);    
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="myTable">
      <tr>
        <th>Day</th><th>Hours</th>
      </tr>
      <tr>
        <td>Wed</td><td>7</td>
      </tr>   
      <tr>
        <td>Fri</td><td>7.5</td>
      </tr> 
      <tr>
        <td>Mon</td><td>8</td>
      </tr>       
    </table>

但是，您可能需要更改工作日缩写，因为我注意到您的表格显示的是“Weds”而不是“Wed”。

如何更改动态创建的表中的行顺序？

1 个答案: