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显示几分钟前、几天前等的更多相关文章

  1. Java封装的与当前时间比较，得到多少年，多少月，多少天前,多少小时前，多小分钟前

    public class CalendarCal { /**  * 与当前时间比较,得到多少年,多少月,多少天前,多少小时前,多小分钟前  *   * @param calendar  *       ...

  2. 使用C#把发表的时间改为几个月,几天前,几小时前,几分钟前,或几秒前

    //使用C#把发表的时间改为几个月,几天前,几小时前,几分钟前,或几秒前 //2008年03月15日 星期六 02:35 public string DateStringFromNow(DateTim ...

  3. js jq插件 显示中文时间戳 刚刚 N分钟前 N小时前 今天 上午 下午 日期格式化

    注:页面需提前引用JQ ; $.fn.extend({ /* ** notes: 获取13位时间戳的简单操作 ** new Date('2018-02-01 15:10:00').getTime() ...

  4. php根据时间显示刚刚,几分钟前,几小时前的实现代码

    发布时间距现在的时间 function tranTime($time) { $rtime = date("m-d H:i", $time); $htime = date(" ...

  5. 用javascript写一个显示时间差 几分钟前 几小时前 几天前 几周前 大于一个月显示日期

    window.onload = function(){ var show_times = $(".times span"); for(var i=0;i<show_times ...

  6. dedecms发布文章时间显示多少分钟前

    /**文章发布多少时间前*/function tranTime($time) { $rtime = date("m-d H:i",$time); $htime = date(&qu ...

  7. PHP 显示文章发布日期 一小时前 一天前 一月前 一年前

    <?PHP /*** 传入日期格式或时间戳格式时间,返回与当前时间的差距,如1分钟前,2小时前,5月前,3年前等* @param string or int $date 分两种日期格式" ...

  8. JS 时间转化为几分钟前 几小时前 几天前

    背景:最近公司要做动态列表,类似于微信朋友圈.动态创建时间就需要显示为 刚刚.几分钟前.几小时前.几天前.2018-05-15,这样的形式. 代码如下 var minute = 1000 * 60; ...

  9. 使用C#把发表的时间改为几年前，几个月,几天前,几小时前,几分钟前,或几秒前

    我们在评论中往往会看到多少天前,多少小时前. 实现原理:现在时间-过去时间 得到的时间差来做比较 下面我定义了一个Helper类,大家直接引用即可,参数就是时间差,注意时间差类型是TimeSpan类型 ...

随机推荐

  1. 如何完全卸载VS2010

    1.首先用360卸载,当卸载完成后,提示有残余的话,就强力清除 2,接着,下载IobitUninstaller工具 3.按照下面进行卸载 1.Microsoft .NET Framework 4 框架 ...

  2. GCC编译C程序源代码

    编译简单的 C 程序 C 语言经典的入门例子是 Hello World,下面是一示例代码: #include <stdio.h>  int main(void)  {     printf ...

  3. Java开发之File类

    File类 File类是对文件系统中文件以及文件夹进行封装的对象,可以通过对象的思想来操作文件和文件夹. File类保存文件或目录的各种元数据信息,包括文件名.文件长度.最后修改时间.是否可读.获取当 ...

  4. 1523. K-inversions(K逆序对）

    1523 这题应该说有一些DP的思想吧 dp[i][j]表示以i为结尾第j个数的个数 k单调下降 直接求的话肯定超时 然后用树状数组来进行维护 求k-1次树状数组 #include <iostr ...

  5. 设置一个POJO的某个属性的默认值

    //月利率private BigDecimal monthRate=new BigDecimal(0);  

  6. JXL获取excel批注

    /** * Jxl.jar(2.6.12) * @author lmiky * @date 2011-11-26 */ public class JxlTest { /** * 测试获取批注 * @a ...

  7. c语言变量名称与变量

    0x00030 , 0x00031 ,0x00032 ,0x00033 是四个字节,用来存放0x00010(字母a的地址)

  8. Java Web程序工作原理

    Web开发的最重要的基本功能是HTTP:Java Web开发的最重要的基本功是Servlet Specification.HTTP和Servlet Specitication对于Web Server和 ...

  9. 魅族MX2代理设置

    魅族MX2买了快2年了,今天才知道有这个功能,唉 连接一个无线网络,比如我的centos 长按网络名字 选代理设置,设置自己的代理,再也不用SS 或 VPN 的android端了,老是提示ROOT权限 ...

  10. iOS7适配之设计篇

    (注:文章简要翻译自 Apple <iOS 7 UI Transition Guide>,由于该文档为开发者预览版,并非最终文档,所以 iOS7 正式上线可能有部分不同) 准备工作 iOS ...