javasctipt显示几分钟前、几天前等

jsp页面：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

  <head>

    <base href="<%=basePath%>">

    <script type="text/javascript" src="http://code.jquery.com/jquery-1.10.1.min.js"></script>

    <script type="text/javascript" src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>

    <script type="text/javascript" src="<%=basePath%>/js/timeago.js" ></script>

  </head>

  <body>

    This is my JSP page. <br>

     <p>${time}</p>

    <span class="time timeago" title="2014-4-29 15:23"></span>

  </body>

</html>

 <script type="text/javascript">

     jQuery("span.timeago").timeago();

 </script>

timeago.js代码

(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.wordSeparator || "";

      if ($l.wordSeparator === undefined) { separator = " "; }

      return $.trim([prefix, words, suffix].join(separator));

    },

    parse: function(iso8601) {

      var s = $.trim(iso8601);

      s = s.replace(/\.\d+/,""); // remove milliseconds

      s = s.replace(/-/,"/").replace(/-/,"/");

      s = s.replace(/T/," ").replace(/Z/," UTC");

      s = s.replace(/([\+\-]\d\d)\:?(\d\d)/," $1$2"); // -04:00 -> -0400

      return new Date(s);

    },

    datetime: function(elem) {

      var iso8601 = $t.isTime(elem) ? $(elem).attr("datetime") : $(elem).attr("title");

      return $t.parse(iso8601);

    },

    isTime: function(elem) {

      // jQuery's `is()` doesn't play well with HTML5 in IE

      return $(elem).get(0).tagName.toLowerCase() === "time"; // $(elem).is("time");

    }

  });

  // functions that can be called via $(el).timeago('action')

  // init is default when no action is given

  // functions are called with context of a single element

  var functions = {

    init: function(){

      var refresh_el = $.proxy(refresh, this);

      refresh_el();

      var $s = $t.settings;

      if ($s.refreshMillis > 0) {

        setInterval(refresh_el, $s.refreshMillis);

      }

    },

    update: function(time){

      $(this).data('timeago', { datetime: $t.parse(time) });

      refresh.apply(this);

    },

    updateFromDOM: function(){

      $(this).data('timeago', { datetime: $t.parse( $t.isTime(this) ? $(this).attr("datetime") : $(this).attr("title") ) });

      refresh.apply(this);

    }

  };

  $.fn.timeago = function(action, options) {

    var fn = action ? functions[action] : functions.init;

    if(!fn){

      throw new Error("Unknown function name '"+ action +"' for timeago");

    }

    // each over objects here and call the requested function

    this.each(function(){

      fn.call(this, options);

    });

    return this;

  };

  function refresh() {

    var data = prepareData(this);

    var $s = $t.settings;

    if (!isNaN(data.datetime)) {

      if ( $s.cutoff == 0 || distance(data.datetime) < $s.cutoff) {

        $(this).text(inWords(data.datetime));

      }

    }

    return this;

  }

  function prepareData(element) {

    element = $(element);

    if (!element.data("timeago")) {

      element.data("timeago", { datetime: $t.datetime(element) });

      var text = $.trim(element.text());

      if ($t.settings.localeTitle) {

        element.attr("title", element.data('timeago').datetime.toLocaleString());

      } else if (text.length > 0 && !($t.isTime(element) && element.attr("title"))) {

        element.attr("title", text);

      }

    }

    return element.data("timeago");

  }

  function inWords(date) {

    return $t.inWords(distance(date));

  }

  function distance(date) {

    return (new Date().getTime() - date.getTime());

  }

  // fix for IE6 suckage

  document.createElement("abbr");

  document.createElement("time");

}));

controller层：

package com.spring.controller;

import java.io.IOException;

import java.io.PrintWriter;

import java.util.Date;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

import net.sf.json.JSONArray;

import org.springframework.stereotype.Controller;

import org.springframework.web.bind.annotation.RequestMapping;

import org.springframework.web.bind.annotation.RequestMethod;

import org.springframework.web.servlet.ModelAndView;

import com.spring.model.JsonMoel;

import com.sun.org.apache.bcel.internal.generic.NEW;

/**

 * @author Qixuan.Chen

 * 创建时间：2014-4-29

 */

@Controller

public class TimeAgoController {

	/**

	 * @param request

	 * @param response

	 * @return

	 * @throws IOException

	 */

	@RequestMapping(value="time/show", method = {RequestMethod.POST,RequestMethod.GET})

	public ModelAndView PostJsonTest(HttpServletRequest request,HttpServletResponse response) throws IOException{

		ModelAndView mav=new ModelAndView();

		mav.addObject("time", new Date());

		mav.setViewName("time/timeago");

		return mav;

	}

}

javasctipt显示几分钟前、几天前等的更多相关文章

Java封装的与当前时间比较，得到多少年，多少月，多少天前,多少小时前，多小分钟前
public class CalendarCal { /** * 与当前时间比较,得到多少年,多少月,多少天前,多少小时前,多小分钟前 * * @param calendar * ...
使用C#把发表的时间改为几个月,几天前,几小时前,几分钟前,或几秒前
//使用C#把发表的时间改为几个月,几天前,几小时前,几分钟前,或几秒前 //2008年03月15日星期六 02:35 public string DateStringFromNow(DateTim ...
js jq插件显示中文时间戳刚刚 N分钟前 N小时前今天上午下午日期格式化
注:页面需提前引用JQ ; $.fn.extend({ /* ** notes: 获取13位时间戳的简单操作 ** new Date('2018-02-01 15:10:00').getTime() ...
php根据时间显示刚刚,几分钟前,几小时前的实现代码
发布时间距现在的时间 function tranTime($time) { $rtime = date("m-d H:i", $time); $htime = date(" ...
用javascript写一个显示时间差几分钟前几小时前几天前几周前大于一个月显示日期
window.onload = function(){ var show_times = $(".times span"); for(var i=0;i<show_times ...
dedecms发布文章时间显示多少分钟前
/**文章发布多少时间前*/function tranTime($time) { $rtime = date("m-d H:i",$time); $htime = date(&qu ...
PHP 显示文章发布日期一小时前一天前一月前一年前
<?PHP /*** 传入日期格式或时间戳格式时间,返回与当前时间的差距,如1分钟前,2小时前,5月前,3年前等* @param string or int $date 分两种日期格式" ...
JS 时间转化为几分钟前几小时前几天前
背景:最近公司要做动态列表,类似于微信朋友圈.动态创建时间就需要显示为刚刚.几分钟前.几小时前.几天前.2018-05-15,这样的形式. 代码如下 var minute = 1000 * 60; ...
使用C#把发表的时间改为几年前，几个月,几天前,几小时前,几分钟前,或几秒前
我们在评论中往往会看到多少天前,多少小时前. 实现原理:现在时间-过去时间得到的时间差来做比较下面我定义了一个Helper类,大家直接引用即可,参数就是时间差,注意时间差类型是TimeSpan类型 ...

随机推荐

MQ-传输方式Topic和Queue的对比
Jms规范里的两种message传输方式Topic和Queue,两者的对比如下表(): Topic Queue 概要 Publish Subscribe messaging 发布订阅消息 Poi ...
hdu4639Hehe
http://acm.hdu.edu.cn/showproblem.php?pid=4639 统计连续he的数量恰为斐波序列不同块进行相乘 #include <iostream> #i ...
poj3321Apple Tree（树状数组）
http://poj.org/problem?id=3321 刚一看题以为要建一颗树看了下讨论说dfs 这里dfs遍历时设的标号很好一个low一个high 包含了以这一节点为根节点的子树结点的所有 ...
struts2启动报错com/opensymphony/xwork2/spring/SpringObjectFactory.java:220:-1
好久没有搞struts2,今天配置strut2.2.1,启动时遇到个小问题.记录下. tomcat启动报错: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 ...
Visual Studio Developer Command Prompt删除localdb的方法
PM> sqllocaldb.exe stop v11. LocalDB instance "v11.0" stopped. PM> sqllocaldb.exe de ...
A*算法完全理解
注:原文出自Patrick Lester,一稿翻译为Panic.很久以前的老文章了,但我觉得真的非常的经典,想把它完善一下让以后的人能够更好的体会原作者和原翻译的精髓吧.我在此基础上修改了部分译文,更 ...
POJ 2112 Optimal Milking (Floyd+二分+最大流)
[题意]有K台挤奶机,C头奶牛,在奶牛和机器间有一组长度不同的路,每台机器每天最多能为M头奶牛挤奶.现在要寻找一个方案,安排每头奶牛到某台机器挤奶,使得C头奶牛中走过的路径长度的和的最大值最小. 挺好 ...
CentOS 7 安装 mariaDB
1.安装数据库 [root@localhost ~]# yum -y install mariadb-server mariadb mariadb-devel 2.启动数据库[root@localh ...
JPA--联合主键
联合主键的一些知识: 使用@EmbeddedId标示联合主键: 在联合主键类中只是定义确定联合主键的字段即可: * 联合主键类的规则 * 1.必须包含一个无参的构造函数 * 2.必须实现序列化接口 * ...
undo日志
InnoDB’s Undo 前言 Undo log是InnoDB MVCC事务特性的重要组成部分.当我们对记录做了变更操作时就会产生undo记录,Undo记录默认被记录到系统表空间(ibdata)中, ...

javasctipt显示几分钟前、几天前等

javasctipt显示几分钟前、几天前等的更多相关文章

随机推荐

热门专题