javascript - JQuery 按姓氏对项目进行排序

Question

我想对要替换的姓氏和文本进行排序，但我无法做到这一点。我已经尝试过以下。

HTML

<div id="sort-by-name">
  <table>
    <tbody>
      <tr>
        <tr>
          <td class="names">
            <span class="toggle"></span> Betty j. Sean
          </td>
        </tr>
        <tr>
          <td class="names">
            <span class="toggle"></span> Ali Khan
          </td>
        </tr>
        <tr>
          <td class="names">
            <span class="toggle"></span> Will Turner
          </td>
        </tr>
    </tbody>
  </table>
</div>

//对名称进行排序

var items = [];
$('#ByMember table tbody .irwMemberName').each(function () {
    items.push($(this).html());
});
items.sort();
console.log(items);

我还尝试向姓氏单词添加一个类。然后应用上面的排序函数，它实际上对所有姓氏进行排序，但我如何通过它对整个姓氏进行排序并替换。

$("#sort-by-name table tbody .names").html(function(index, old) {
    return old.replace(/(\b\w+)$/, '<span class="name_identifier">$1</span>');
});

如果我不清楚，请告诉我。另外请忽略任何拼写错误，我已在此处修改了用于发布的代码。

Answer 1

你可以这样做。检查 fiddle :Fiddle

var els = $("#sort-by-name table tbody tr")
.sort(function(a,b){
    var t1 = $(a).find('.names')[0].innerText.split(' ').pop(),
            t2 = $(b).find('.names')[0].innerText.split(' ').pop();

    if(t2 < t1) {
        return 1;
    } else {
      return -1;
    }
})
.each(function() {
  var t = this.innerText.replace(/(\w+)$/, '<span class="name_identifier">$1</span>');
  return $(this).html( t );
});
$('#bodyid').html(els);