timeago jquery 几小时前 插件

What?

Timeago is a jQuery plugin that makes it easy to support automatically updating fuzzy timestamps (e.g. "4 minutes ago" or "about 1 day ago"). Download, view the examples, and enjoy.

You opened this page about a minute ago. (This will update every minute. Wait for it.)

This page was last modified about a month ago.

Ryan was born 36 years ago.

Why?

Timeago was originally built for use with Yarp.com to timestamp comments.

  • Avoid timestamps dated "1 minute ago" even though the page was opened 10 minutes ago;timeago refreshes automatically.

  • You can take full advantage of page caching in your web applications, because the timestamps aren't calculated on the server.

  • You get to use microformats like the cool kids.

How?

First, load jQuery and the plugin:

<script src="jquery.min.js" type="text/javascript"></script>
<script src="jquery.timeago.js" type="text/javascript"></script>

Now, let's attach it to your timestamps on DOM ready:

jQuery(document).ready(function() {
  jQuery("abbr.timeago").timeago();
});

This will turn all abbr elements with a class of timeago and an ISO 8601 timestamp in the title:

<abbr class="timeago" title="2008-07-17T09:24:17Z">July 17, 2008</abbr>

into something like this:

<abbr class="timeago" title="July 17, 2008">6 years ago</abbr>

which yields: 6 years ago. As time passes, the timestamps will automatically update.

You can also use it programmatically:

jQuery.timeago(new Date());             //=> "less than a minute ago"
jQuery.timeago("2008-07-17");           //=> "6 years ago"
jQuery.timeago(jQuery("abbr#some_id")); //=> "6 years ago"     // [title="2008-07-20"]

To support timestamps in the future, use the allowFuture setting:

jQuery.timeago.settings.allowFuture = true;

To disable timestamps in the past, use the allowPast setting. This setting is set to true by default. When set to false, if the time is in the past then instead of displaying a message like "5 minutes ago" a static message will be displayed. The staic message displayed can be configured with thestrings.inPast setting:

jQuery.timeago.settings.strings.inPast = "time has elapsed";
jQuery.timeago.settings.allowPast = false;

Excusez-moi?

Yes, timeago has locale/i18n/language support. Here are some configuration examples. Please submit a GitHub pull request for corrections or additional languages.

Where?

Download the "stable" release.

The code is hosted on GitHub: http://github.com/rmm5t/jquery-timeago. Go on, live on the edge.

Who?

Timeago was built by Ryan McGeary (@rmm5t) while standing on the shoulders of giants. John Resig wrote about a similar approach. The verbiage was based on the distance_of_time_in_wordsActionView helper in Ruby on Rails.

When?

Timeago was conceived 6 years ago. (Yup, that's powered by timeago too)

What else?

HTML5 has a new time tag and timeago supports it too.

<time class="timeago" datetime="2008-07-17T09:24:17Z">July 17, 2008</time>

Attach timeago like so:

jQuery(document).ready(function() {
  jQuery("time.timeago").timeago();
});

Are you concerned about time zone support? Don't be. Timeago handles this too. As long as your timestamps are in ISO 8601 format and include a full time zone designator (&plusmn;hhmm), everything should work out of the box regardless of the time zone that your visitors live in.

Huh?

Need a Rails helper to make those fancy microformat abbr tags? Fine, here ya go:

def timeago(time, options = {})
  options[:class] ||= "timeago"
  content_tag(:abbr, time.to_s, options.merge(:title => time.getutc.iso8601)) if time
end

Do you use Timeago?

Great! Please add your site to the list of Sites that use Timeago.

转载于:https://my.oschina.net/u/554046/blog/279700

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值