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类型 ...
随机推荐
- javascript 简单的计算器
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx. ...
- 通过ngx-lua来统计Nginx上的虚拟主机性能数据
Web server调研分析 Filed under: Web Server — cmpan @ 2012-10-29 20:38:34 摘要 简单可依赖的架构首先需要有一个简单可依赖的前端WebSe ...
- naotu.baidu.com 非常棒的脑图在线工具
1.png 2.txt 短租 前台功能 房源查看 房源搜索 城市房源 注册登录 预定房源 房源退订 在线支付 评价房源 个人中心 我的订单 我的账户 我的收藏 消息通知 管理员后台 房源发布 会员管理 ...
- VBSCRIPT事件绑定(隐式)
很多新版的浏览器都开始不支持VBSCRIPT 所以系统开始不断地有script错误,开始比较多地接触VBSCRIPT vbscript 和javascript 事件绑定的类似方法为 vbscript: ...
- Codeforces Round #306 (Div. 2)
A. Two Substrings You are given string s. Your task is to determine if the given string s contains t ...
- Welcome to Linux From Scratch!
/**************************************************************************** * Welcome to Linux Fro ...
- listview使用总结
1. android给listview的item设定高度 原文网址:http://blog.csdn.net/l_serein/article/details/7403992 在item的layout ...
- 扩展类加载器-------改变JAVA的父优先类加载顺序
java的类加载机制默认情况下是采用委托模型:当加载某个类时JVM会首先尝试用当前类加载器的父类加载器加载该类,若父类加载器加载不到再由当前类加载器来加载,因此这种模型又叫做“父优先”模型. 但是在实 ...
- Jmeter性能测试之如何写Java请求测试用例类
一. 引言: 最近工作中的一个项目要求做性能测试,该项目由提供服务的几个应用组成,选用的框架是阿里巴巴公司开源的服务框架Dubbo.关于Dubbo的介绍,网上也有很多资料,本人只是做了粗略的了解,没有 ...
- [selenium webdriver Java]检查元素状态
许多测试失败是因为点击一个元素失败或者在一个不可见的字段中输入文字,或者是在不可输入的文本中输入文字. 我们可以在具体操作之前,检查一下元素的状态.WebElement类提供了这样的方法. 方法 目的 ...