JS、jqueryは数分前、数時間前、数日前などの時間差表示効果を実現するコードの実例を共有します。
類似の機能を実現するには、JSを使えばいいです。実現方法は以下の通りです。
一、javascript関数の実現:例1:
実例2:
HTMLコード:
一、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版のsttotimeに相当します。実例2:
//js :
function getDateTimeStamp(dateStr){
return Date.parse(dateStr.replace(/-/gi,"/"));
}
二、jqueryプラグインの実現HTMLコード:
<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>
コールコード:
<span class="time timeago" title="<fmt:formatDate value="${comment.createAt}" pattern="yyyy-MM-dd HH:mm:ss"/>"></span>
プラグインのソースコード:
jQuery("span.timeago").timeago();