jQuery jToday Plugin

http://jtoday.codeplex.com/

jQuery jToday Plugin
http://blog.donavon.com/2009/09/jquery-jtoday-plugin.html

jToday.js code:

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
// jToday a simple jQuery date display plugin by Donavon West
// Copyright 2009 Donavon West. All rights reserved
 
(function($, document) {
//--------------------
$.fn.jToday = function(p_date) {
 
    var jTodayData = "jTodayData", div = "div", match, data, months = "Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec".split(" ");
 
    // ------------------------
    // set the class and inner HTML
    function setStuff(p_el, p_class, p_str) {
        p_el.innerHTML = p_str;
        p_el.className = p_class + " " + p_class + p_str;
    }
     
    // ------------------------
    //constructor code
 
    return this.each(function() {
        data = $.data(this, jTodayData);
        if (!data) { //only done once per element
            data = {};
             
            //does innerHTML contain a date string? (i.e. YYYY-MM-DD)
            match = this.innerHTML.match(/^(\d\d\d\d)-(\d\d)-(\d\d)( |$|T)/);
            if (match) {
                data.date = new Date(match[1], parseInt(match[2],10)-1, match[3]); //yes, use it
            } else {
                data.date = p_date ? p_date : new Date(); //use the date passed in (or default to today)
            }
 
            //create the sub elements
            this.innerHTML = "";
            data.yearEl = document.createElement(div);
            this.appendChild(data.yearEl);
            data.monthEl = document.createElement(div);
            this.appendChild(data.monthEl);
            data.dayEl = document.createElement(div);
            this.appendChild(data.dayEl);
            $.data(this, jTodayData, data); //save it for next time
        } else {
            data.date = p_date ? p_date : data.date; //use the date passed in (or the old value if undefined)
        }
 
        setStuff(data.yearEl, "year", data.date.getFullYear().toString() );
        setStuff(data.monthEl, "month", months[data.date.getMonth()] );
        setStuff(data.dayEl, "day", (data.date.getDate()).toString() );
    });
 
};
 
//--------------------
})(jQuery, document); //minify trick, plus don't EVER assume that $ is the jQuery object. it's just bad


html code:

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>jToday</title>
<meta content="key" name="Geovin Du"/>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery-ui.min.js"></script>
<script type="text/javascript" src="jToday.js"></script>
<style type="text/css">
.jToday {
    position:relative;
    width:40px;
    height:38px;
    background-image:url(images/jTodayRed.png);
    overflow:hidden;
    text-align:center;
}
.jToday .year {
    display:none;
}
.jToday .month {
    font-weight:bold;
    color:#ffffff;
    font-size:14px;
    line-height:14px;
}
.jToday .day {
    font-weight:bold;
    color:#444444;
    line-height:22px;
    font-size:22px;
}
</style>
<script type="text/javascript">
//FROM：　http://blog.donavon.com/2009/09/jquery-jtoday-plugin.html
//Geovin Du 涂聚文 缔友计算机信息技术有限公司
//2011-07-6
//
//$(".jToday").jToday();
//$(".jToday").jToday(new Date(2009, 3, 27));  //November 19, 2010
</script>
</head>
 
<body>
<div class="jToday"></div>
<!-------jToday.js 显示样式-------->
<div class="jToday">Sep 19 2011</div>
<!-------CSS样式显示-------->
<div class="jToday">
<div class="year">2011</div>
<div class="month">Sep</div>
<div class="day">24</div>
</div> <!--2009-09-24 this will display Sep 24 -->
</body>
 
</html>
posted @   ®Geovin Du Dream Park™  阅读(291)  评论(0)  编辑  收藏  举报
编辑推荐：
· AI与.NET技术实操系列：基于图像分类模型对图像进行分类
· go语言实现终端里的倒计时
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语，封装的思维：从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热？
阅读排行：
· 25岁的心里话
· 闲置电脑爆改个人服务器（超详细） #公网映射 #Vmware虚拟网络编辑器
· 基于 Docker 搭建 FRP 内网穿透开源项目（很简单哒）
· 零经验选手，Compose 一天开发一款小游戏！
· 一起来玩mcp_server_sqlite，让AI帮你做增删改查！！
< 2011年7月 >
日 一 二 三 四 五 六
26 27 28 29 30 1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30
31 1 2 3 4 5 6
点击右上角即可分享
微信分享提示