jQuery Isotope按最后发布日期排序异常问题求助

核心问题分析 #

你当前的两种尝试都存在本质问题：

• 基于[data-id]排序：内容ID和发布日期没有强关联（比如编辑、补录内容会导致ID顺序和发布时间脱节），自然无法正确排序。
• 直接解析.lastposted的文本：今天/昨天这类相对日期字符串无法被Date.parse()正确识别，会返回NaN或错误时间值，导致排序逻辑失效。

可行解决思路 #

方案1：后端输出标准时间戳（推荐） #

这是最可靠的方式，让后端把last_post字段转换成Unix时间戳（毫秒/秒格式均可，保持统一），并添加到元素的自定义data属性中：

修改HTML

<div id="GROUP-<!-- |g_id| -->" class="ml-item ml-mem group-<!-- |g_id| -->" 
     data-category="group-<!-- |g_id| -->" 
     data-id="<!-- |id| -->" 
     data-last-post-timestamp="<!-- |last_post_timestamp| -->">

<span class="lastposted"><!-- |last_post| --></span>

<button data-sort-value="lastposted">last posted by</button>

注：<!-- |last_post_timestamp| -->是后端生成的时间戳变量，比如PHP可以用strtotime($last_post)*1000生成毫秒级时间戳。

修改Isotope配置

更新getSortData和sortAscending，让排序依据时间戳：

getSortData: {
    name: '.name',
    faceclaim: '.faceclaim',
    posts: '.posts parseInt',
    group: '[data-category]',
    lastposted: '[data-last-post-timestamp] parseInt', // 替换原配置
    alias: '.alias'
},

sortAscending: {
    name: true,
    posts: false,
    lastposted: false, // 时间戳越大越新，设为false实现最新在前
    group: true,
    faceclaim: true,
    alias: true
},

方案2：前端转换相对日期（仅后端无法修改时使用） #

如果后端无法输出时间戳，需要在前端把今天/昨天这类文本转换成标准Date对象，再转成时间戳用于排序：

修改Isotope的getSortData

自定义排序函数解析日期文本：

getSortData: {
    // 其他字段不变
    lastposted: function(itemElem) {
        const dateText = $(itemElem).find('.lastposted').text().trim();
        let targetDate = new Date();
        
        // 处理相对日期
        if (dateText.includes('今天')) {
            targetDate.setHours(0,0,0,0);
        } else if (dateText.includes('昨天')) {
            targetDate.setDate(targetDate.getDate() - 1);
            targetDate.setHours(0,0,0,0);
        } else {
            // 处理标准日期格式，比如"2023年4月2日"
            targetDate = new Date(dateText.replace('年','/').replace('月','/').replace('日',''));
        }
        
        return targetDate.getTime(); // 返回时间戳用于排序
    }
},

注：这种方式需要确保日期文本格式统一，否则解析容易出错，优先推荐方案1。

验证修改 #

点击排序按钮后，Isotope会基于时间戳的数值大小排序，今天的时间戳最大，昨天次之，历史日期按时间顺序排列，解决混乱问题。

内容的提问来源于stack exchange，提问作者user21968485