Home >Web Front-end >JS Tutorial >Javascript method to achieve detailed time reminder information effect_javascript skills

Javascript method to achieve detailed time reminder information effect_javascript skills

WBOY
WBOYOriginal
2016-05-16 16:10:181393browse

The example in this article describes the method of using javascript to achieve the effect of detailed time reminder information. Share it with everyone for your reference. The details are as follows:

We often see very user-friendly time reminders on social networks, such as what your friends updated a few minutes ago, and what information your friends updated a few days ago.
These small tips are much more user-friendly than directly displaying a certain year and month. We can use different programs to achieve this effect. Below I achieve this effect through front-end javascript.
This can reduce the pressure on the backend server.

Javascript implementation code is as follows:

Copy code The code is as follows:
// This function implements a more user-friendly time prompt
// @param date_str The time passed, the time format is such as: 2010-12-14 18:36:09
function date_parser_diff_return(date_str){
var date=new Date();
If(typeof(date_str)!='string')return date;
var date_arr=date_str.split(new RegExp("[:| |-]","ig"));
var date_obj = new Date(date_arr[0],date_arr[1]-1,date_arr[2],date_arr[3],date_arr[4],date_arr[5]);
var date_seconddiff=( new Date().getTime()-date_obj.getTime() ) /1000 ;
date_str_w='';
If(date_seconddiff <60*30)date_str_w= Math.ceil(date_seconddiff/60) "minutes ago";
If(!date_str_w && date_seconddiff <3600)date_str_w= "1 hour ago";
If(!date_str_w && date_seconddiff <3600*2)date_str_w= "2 hours ago";
If(!date_str_w && date_seconddiff <3600*3)date_str_w= "3 hours ago";
If(!date_str_w && date.getFullYear()==date_arr[0] && date.getMonth()==date_arr[1]-1 && date.getDate()==date_arr[2])
date_str_w= "Today" date_arr[3] ':' date_arr[4];
If(!date_str_w && date.getFullYear()==date_arr[0] && date.getMonth()==date_arr[1]-1 && date.getDate()-1==date_arr[2])
                  date_str_w= "Yesterday " date_arr[3] ':' date_arr[4];
If(!date_str_w && date.getFullYear()==date_arr[0] && date.getMonth()==date_arr[1]-1 && date.getDate()-2==date_arr[2])
                 date_str_w= "The day before yesterday " date_arr[3] ':' date_arr[4];
If(!date_str_w && date.getFullYear()==date_arr[0] && date.getMonth()==date_arr[1]-1 )
date_str_w= (date.getMonth() 1) "month" date_arr[2] "number" date_arr[3] ':' date_arr[4];
If(!date_str_w && date.getFullYear()==date_arr[0])
                 date_str_w= "This year" date_arr[1] "Month" date_arr[2] "Number" date_arr[3] ':' date_arr[4];
If(!date_str_w && date.getFullYear()-1==date_arr[0])
               date_str_w= "Last year" date_arr[1] "Month" date_arr[2] "No." date_arr[3] ':' date_arr[4];
           document.write(date_str_w);
};

I hope this article will be helpful to everyone’s JavaScript programming design.

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn