Question

我有一张桌子，在那张桌子上我有一个栏目，显示了几个月和几天的剩余时间。像这样：

Days left:
6 month(s) 6 d.
11 d.
23 month(s) 25d.
2 d.

我需要一个可以识别数月，数日并按升序或降序排序的JavaScript，如下所示：

Days left:
2 d.
11 d.
6 month(s) 6 d.
23 month(s) 25 d.

我使用此代码：

/* Table Sort */

$('body').on('click', '.sort-table th', function() {
  // sorts only if th has class 'sortable'
  if ($(this).hasClass('sortable')) {
    // toggle caret up/down
    $(this).children('.fa-caret-down, .fa-caret-up').toggleClass('fa-caret-down').toggleClass('fa-caret-up');
    var table = $(this).parents('table').eq(0);
    // use dynamic method as sort comparison function
    var compare = createDynamicMethod(this);
    var rows = table.find('tr:gt(0)').toArray().sort(compare($(this).index()));
    this.asc = !this.asc;
    if (!this.asc) {
      rows = rows.reverse()
    }

    for (var i = 0; i < rows.length; i++) {
      table.append(rows[i])
    }
  }
});

// compares images,th should have class 'sort-img'
function imageCompare(index) {
  return function(a, b) {
    var valA = imageValue(a, index);
    var valB = imageValue(b, index);

    return valA.toString().localeCompare(valB);
  }
}

// get image value for comparison (by attribute 'alt')
function imageValue(a, index) {
  var valA = $(a).children('td').eq(index).children('img').attr('alt');

  return valA ? valA : '';
}

// compares amounts (15 kg, 5 men., 41% etc.), th should have class 'sort-amount'
function amountCompare(index) {
  return function(a, b) {
    var valA = amountValue(a, index);
    var valB = amountValue(b, index);

    return valA - valB;
  }
}

// get amount value (number without measurement units)
function amountValue(a, index) {
  var td = $(a).children('td').eq(index);
  // some values in template are surrounded by <b> tags, fix
  var valA = $(td).children().length > 0 ? $(td).children().first().html() : $(td).html();

  return /([0-9]+\.[0-9]+)|([0-9]+)/.exec(valA)[0];
}

// compares simple numbers or text, for th with only 'sortable' class
function defaultCompare(index) {
  return function(a, b) {
    var valA = defaultValue(a, index);
    var valB = defaultValue(b, index);

    return $.isNumeric(valA) && $.isNumeric(valB) ? valA - valB : valA.toString().localeCompare(valB);
  }
}

// get simple number or text value
function defaultValue(a, index) {
  var td = $(a).children('td').eq(index);
  // if td has children (for example <a>), return first child value
  var valA = $(td).children().length > 0 ? $(td).children().first().html() : $(td).html();

  valA = valA.replace(/[^\-a-zA-Z0-9]/g,'');

  return valA == '' ? 0 : valA;
}

// compares progress bar with amount invested values, th should have class 'sort-bar'
function barCompare(index) {
  return function(a, b) {
    var valA = barValue(a, index);
    var valB = barValue(b, index);

    return valA.localeCompare(valB);
  }
}

// get value in progress bar ('xx€ / xx€')
function barValue(a, index) {
  return $(a).children('td').eq(index).find('span').html();
}

// compares amounts (15 kg, 5 men., 41% etc.), th should have class 'sort-amount'
function complexCompare(index) {
  return function(a, b) {
    var valA = complexValue(a, index);
    var valB = complexValue(b, index);

    return valA - valB;
  }
}

// get complex value
function iconValue(a, index) {
  var td = $(a).children('td').eq(index);
  // some values in template are surrounded by <b> tags, fix
  var valA = $(td).html();

  valA = valA.replace(/[^\-a-zA-Z0-9]/g,'');

  return valA != null && valA != '' ? 1 : 0;
}

// compares amounts (15 kg, 5 men., 41% etc.), th should have class 'sort-amount'
function iconCompare(index) {
  return function(a, b) {
    var valA = iconValue(a, index);
    var valB = iconValue(b, index);

    return valA - valB;
  }
}

// get complex value
function complexValue(a, index) {
  var td = $(a).children('td').eq(index);
  // some values in template are surrounded by <b> tags, fix
  var valA = $(td).children().length > 0 ? $(td).children().first().html() : $(td).html();
  valA = valA.replace(/[^\-a-zA-Z0-9]/g,'');
  var valR = /([0-9]+\.[0-9]+)|([0-9]+)/.exec(valA);

  return valR != null ? valR[0] : 0;
}

/*
 * creates dynamic method that is used for row sorting
 * accepts th element and looks for class 'sort-<smth>'
 * then creates method <smth>Compare
 */
function createDynamicMethod(elem) {
  var classnames = /sort-[a-z]+/.exec($(elem).attr('class'));
  var method = (classnames !== null) ? classnames[0] : 'sort-default';
  method = method.substring(5) + 'Compare';

  return eval('(' + method + ')');
}

但它不会识别数月和数日，而是按第一个数字排序：

Days left:
2 d.
6 month(s) 6 d.
11 d.
23 month(s) 25 d.

Answer 1

您可以生成一个具有降序单位数的数组，并迭代这两个数组以进行排序。

function getTime(s) {
    return [+s.match(/\d+(?=\s*month\(s\))/) || 0, +s.match(/\d+(?=\s*d\.)/) || 0];
}

var array = ['6 month(s) 6 d.', '11 d.', '23 month(s) 25d.', '2 d.'];

array.sort((a, b) => {
    var aa = getTime(a),
        bb = getTime(b),
        delta;
    
    aa.some((v, i) => delta = v - bb[i]);
    return delta;
});

console.log(array);

如何按列剩余的几个月和几天对列进行排序

1 个答案: