您现在的位置: 万盛学电脑网 >> 程序编程 >> 脚本专题 >> javascript >> 正文

JS、jquery实现几分钟前、几小时前、几天前等时间差显示效果的代码实例

作者:佚名    责任编辑:admin    更新时间:2022-06-22

 在新浪微博首页看到每条微博后边显示的时间并不是标准的年-月-日格式,而是经过换算的时间差,如:发表于5分钟前、发表于“2小时前”,比起标准的时间显示格式,貌似更加直观和人性化

要实现类似功能,用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:   代码如下: <script>        function jsDateDiff(publishTime){            var d_minutes,d_hours,d_days;            var timeNow = parseInt(new Date().getTime()/1000);            var d;            d = timeNow - publishTime;            d_days = parseInt(d/86400);            d_hours = parseInt(d/3600);            d_minutes = parseInt(d/60);            if(d_days>0 && d_days<4){                return d_days+"天前";            }else if(d_days<=0 && d_hours>0){                return d_hours+"小时前";            }else if(d_hours<=0 && d_minutes>0){                return d_minutes+"分钟前";            }else{                var s = new Date(publishTime*1000);                // s.getFullYear()+"年";         return (s.getMonth()+1)+"月"+s.getDate()+"日";            }        }        </script>     二、jquery插件实现   HTML代码:    代码如下: <span class="time timeago" title="<fmt:formatDate value="${comment.createAt}" pattern="yyyy-MM-dd HH:mm:ss"/>"></span>     调用代码:     代码如下: jQuery("span.timeago").timeago();     插件源码:      代码如下: (function (factory) {   if (typeof define === 'function' && define.amd) {     // AMD. Register as an anonymous module.     define(['jquery'], factory);   } else {     // Browser globals     factory(jQuery);   } }(function ($) {   $.timeago = function(timestamp) {     if (timestamp instanceof Date) {       return inWords(timestamp);     } else if (typeof timestamp === "string") {       return inWords($.timeago.parse(timestamp));     } else if (typeof timestamp === "number") {       return inWords(new Date(timestamp));     } else {       return inWords($.timeago.datetime(timestamp));     }   };   var $t = $.timeago;     $.extend($.timeago, {     settings: {       refreshMillis: 60000,       allowFuture: false,       localeTitle: false,       cutoff: 0,       strings: {         prefixAgo: null,         prefixFromNow: null,         suffixAgo: "前",         suffixFromNow: "from now",         seconds: "1分钟",         minute: "1分钟",         minutes: "%d分钟",         hour: "1小时",         hours: "%d小时",         day: "1天",         days: "%d天",         month: "1月",         months: "%d月",         year: "1年",         years: "%d年",         wordSeparator: "",         numbers: []       }     },     inWords: function(distanceMillis) {       var $l = this.settings.strings;       var prefix = $l.prefixAgo;       var suffix = $l.suffixAgo;       if (this.settings.allowFuture) {         if (distanceMillis < 0) {           prefix = $l.prefixFromNow;           suffix = $l.suffixFromNow;         }       }         var seconds = Math.abs(distanceMillis) / 1000;       var minutes = seconds / 60;       var hours = minutes / 60;       var days = hours / 24;       var years = days / 365;         function substitute(stringOrFunction, number) {         var string = $.isFunction(stringOrFunction) ? stringOrFunction(number, distanceMillis) : stringOrFunction;         var value = ($l.numbers && $l.numbers[number]) || number;         return string.replace(/%d/i, value);       }         var words = seconds < 45 && substitute($l.seconds, Math.round(seconds)) ||         seconds < 90 && substitute($l.minute, 1) ||         minutes < 45 && substitute($l.minutes, Math.round(minutes)) ||         minutes < 90 && substitute($l.hour, 1) ||         hours < 24 && substitute($l.hours, Math.round(hours)) ||         hours < 42 && substitute($l.day, 1) ||         days < 30 && substitute($l.days, Math.round(days)) ||         days < 45 && substitute($l.month, 1) ||         days < 365 && substitute($l.months, Math.round(days / 30)) ||         years < 1.5 && substitute($l.year, 1) ||         substitute($l.years, Math.round(years));         var separator = $l.wor