JS与jQuery实现时间差显示代码详解

102 浏览量更新于2024-08-28 收藏 40KB PDF 举报

本文主要介绍了如何使用JavaScript和jQuery来实现一个功能，即显示一个事件发生后与当前时间之间的时间差，如"几分钟前"、"几小时前"或"几天前"等。通过提供的代码实例，我们可以了解到实现这一功能的具体步骤。在JavaScript中，首先定义了时间单位的常量，如`minute`（分钟）、`hour`（小时）、`day`（天）、`halfamonth`（半月）和`month`（月）。接着，定义了一个名为`getDateDiff`的函数，它接受一个时间戳参数`dateTimeStamp`。该函数获取当前时间的时间戳，并计算与给定时间戳之间的差异值`diffValue`。如果`diffValue`小于0，说明结束日期早于开始日期，此时可以弹出警告提示。接下来，根据`diffValue`判断时间差所在的范围，例如如果`monthC`（月份差）大于等于1，则显示"发表于X个月前"；如果`weekC`（周差）大于等于1，显示"发表于X周前"，以此类推。如果所有条件都不满足，说明事件发生就在刚刚，显示"刚刚发表"。为了将日期字符串转换为时间戳，文章还提供了一个名为`getDateTimeStamp`的函数，它接受日期字符串作为输入，使用正则表达式替换日期分隔符，然后使用`Date.parse`方法解析成时间戳。在实例2中，虽然没有给出完整的代码，但可以推断这是一个类似的实现，可能包含了如何在实际应用中调用这些函数的示例。要实现这个时间差显示功能，开发者需要理解JavaScript的时间处理方法，包括时间戳的概念，以及如何根据时间差计算相对时间表述。这些代码实例可以作为开发时的参考，帮助快速构建此类功能。

JS、、jquery实现几分钟前、几小时前、几天前等时间差显示效实现几分钟前、几小时前、几天前等时间差显示效

果的代码实例分享果的代码实例分享

要实现类似功能，用JS就可以，实现方法如下：

一、javascript函数实现:

实例1：

代码如下:

//JavaScript函数：

var minute = 1000 * 60;

var hour = minute * 60;

var day = hour * 24;

var halfamonth = day * 15;

var month = day * 30;

function getDateDiff(dateTimeStamp){

var now = new Date().getTime();

var diffValue = now – dateTimeStamp;

if(diffValue < 0){

//若日期不符则弹出窗口告之

//alert(“结束日期不能小于开始日期！”);

}

var monthC =diffValue/month;

var weekC =diffValue/(7*day);

var dayC =diffValue/day;

var hourC =diffValue/hour;

var minC =diffValue/minute;

if(monthC>=1){

result=”发表于” + parseInt(monthC) + “个月前”;

}

else if(weekC>=1){

result=”发表于” + parseInt(weekC) + “周前”;

}

else if(dayC>=1){

result=”发表于”+ parseInt(dayC) +”天前”;

}

else if(hourC>=1){

result=”发表于”+ parseInt(hourC) +”个小时前”;

}

else if(minC>=1){

result=”发表于”+ parseInt(minC) +”分钟前”;

}else

result=”刚刚发表”;

return result;

}

若你得到的时间格式不是时间戳，可以使用下面的JavaScript函数把字符串转换为时间戳, 本函数的功能相当于JS版的

strtotime：

代码如下:

//js函数代码：字符串转换为时间戳

function getDateTimeStamp(dateStr){

return Date.parse(dateStr.replace(/-/gi,”/”));

}

实例2：

代码如下:

function jsDateDiff(publishTime){

var d_minutes,d_hours,d_days;

var timeNow = parseInt(new Date().getTime()/1000);

var d;

d = timeNow – publishTime;

下载后可阅读完整内容，剩余3页未读，立即下载

weixin_38624914

粉丝: 7
资源: 950

JS与jQuery实现时间差显示代码详解

使用JS与jQuery实现时间差显示：几分钟前、几小时前

JavaScript实现显示时间差：几分钟前、几天前

JS时间显示：前几天、几小时前、几分钟前的实现技巧

JS实现简单的天数计算器完整实例

jQuery简单倒计时效果完整示例

使用jquery如何获取时间

jquery 倒计时

JS时间格式化：显示为几天/几小时前

【Django.timesince与用户界面友好性】：提升用户体验的时间显示方案，增强界面人性化

若依管理存在任何文件读取漏洞检测系统，渗透测试.zip

最新资源