在jQuery中按数据-事件-日期对div排序

<div class="sortable" data-sort='{"data": 3, "event": "click", "date": "2022-01-01"}'>Div 3</div>
<div class="sortable" data-sort='{"data": 1, "event": "mouseover", "date": "2022-03-01"}'>Div 1</div>
<div class="sortable" data-sort='{"data": 2, "event": "keydown", "date": "2022-02-01"}'>Div 2</div>

// 自定义比较函数
function compareDivs(a, b) {
  // 获取div元素的排序信息
  var dataA = $(a).data('sort').data;
  var dataB = $(b).data('sort').data;
  var eventA = $(a).data('sort').event;
  var eventB = $(b).data('sort').event;
  var dateA = new Date($(a).data('sort').date);
  var dateB = new Date($(b).data('sort').date);

  // 按数据进行排序
  if (dataA < dataB) {
    return -1;
  } else if (dataA > dataB) {
    return 1;
  }

  // 如果数据相同，则按事件进行排序
  if (eventA < eventB) {
    return -1;
  } else if (eventA > eventB) {
    return 1;
  }

  // 如果事件相同，则按日期进行排序
  if (dateA < dateB) {
    return -1;
  } else if (dateA > dateB) {
    return 1;
  }

  // 如果日期相同，则保持原有顺序
  return 0;
}

// 对div元素进行排序
$('.sortable').sort(compareDivs).appendTo('.container');