当前位置: 首页 > 工具软件 > timeago > 使用案例 >

jquery.timeago与jquery.autosize

郎灿
2023-12-01

一、jquery.timeage插件

timeago.js是一款基于jQuery的时间处理插件,它可以轻易的将时间戳转换成如:5分钟前,约3小时前这样的更友好易读的时间轴,而且使用timeago.js无需刷新页面即自动更新页面时间的显示

1、首先需要载入jQuery库和timeago.js

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

2、在页面中添加元素

<abbr class="timeago" title="2012-11-28T11:17:00Z"></abbr> 

3、使用jQuery调用timeago(),运行页面即可看到效果

$(function(){ 
    $(".timeago").timeago(); 
}); 

tips :

timeago.js还支持处理将来的时间,如“3天后”,只需将以下参数设置为true

jQuery.timeago.settings.allowFuture = true; 

timeago.js在标准的UTC时间模式下运行,对于我们处在东八区(+08:00),可以在加载时间时减去8小时,或者在时间格式中使用+08:00来显示准确的北京时间。

举个栗子,假设要处理的是北京时间2012-12-10 18:02:45,那么可以通过以下方式来获取准确的北京时间。

<!--先减去8小时--> 
<abbr class="timeago" title="2012-12-10T10:02:45Z"></abbr> 
<!--在时间后+08:00--> 
<abbr class="timeago" title="2012-12-10T18:02:45Z+08:00"></abbr> 

二、jquery.autosize插件

我们定义textarea(多行文本框)时,一般我们定义了大小,超出文本框时会出现下拉条,看起来实在是有点不爽。
使用该插件,文本框的大小会随着我们输入的内容自动扩大。

1、引入jQuery类库和相关的插件库

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js'></script>
<script src='jquery.autosize.js'></script>

2、定义一个文本框

<textarea id='normal'>普通效果.</textarea>

3、调用一行代码

$('#normal').autosize();

timeago demo下载地址 http://download.csdn.net/detail/jiangjundriver/9870751
autosize demo下载地址 http://download.csdn.net/detail/jiangjundriver/9870752

 类似资料: