博园雅客

平生所学,付之东流;遥眺南岸,吾心悠悠。昙花闪现,残夜孤愁;杯酒逐月,人已白头。
posts - 33, comments - 153, trackbacks - 0, articles - 8

    某次工作需要,回顾了一下过去做的某个项目,突然发现自制的 javascrip Calendar(日历控件),一时遐想无限,勾起不少有关当年(当月?)那些雄心壮志的回忆。

    从少不更事,到处变不惊,人少了很多冲劲,却多了几分稳重;现在自己看这些个“类”,实用的可能已不多,因为新技术早已把它们甩在了身后。但最终决定“开源”并写这篇文章,是考虑到还有很多朋友和我一样,对 javascript 不大懂,甚至有些朋友紧需个把诸如日历控件这样的小玩意应急。是为了和朋友们共同学习也好、让别人应急应用也罢,它总还有些存在的意义。

    这些“类”通过运用 javascript 基本类型,包装了一些简单的应用逻辑,使得代码更好的被复用,并力求代码犹如 c# 般优雅。源码包中完整的“类”名明细为:Calendar(日历控件)、Ajax(异步控件)、PPLive(播放控件)、Text(字符串处理)、ToolTip(提示框)、Xml(Xml文本处理) 、Cookie(Cookie操作)、QueryString(QueryString操作)、Thread(线程)、Timer(定时器),并同时提供了对应各类的 XXXDemon 若干。通过编辑运行 JsTest.htm 可以观看各演示的运行效果。

    很抱歉,宿舍上网不便,因此,这篇文章将拆解成几篇,利用下班后还在公司的时间,逐一介绍这些“类”;我会根据大家的反馈增述或简述、甚至免述相关内容。这是整个源码包的目录结构:

3 - 3

    注意:我对 javascript 是一知半解,是在摸索中制作了上述的“类”;里面肯定有大量的漏洞、错误,希望朋友们抱着“批评”的态度验证。

1、Calendar(日历控件)

    打开 JsTest.htm,编辑 <body/> 内容如下(注释无关脚本引用):

3 - 1

    运行 JsTest.htm,点击输入框,然后可以看到该日历控件;选择相应的日期,并可以对输入框进行日期赋值:

3 - 2

    详细使用方法,请大家参考包内 JsDemons/Html/CalendarDemon.js 文件。这里指出的是,类似一行

        var myCalendar = new Calendar('myCalendar', toolTipPannel, _DaySelectedCallback);

的语句就能创建该控件,两行

        myCalendar.Show(myTextBox, currentDay);

        myCalendar.Hidden();

就能操作该控件,给当时的我一种成就感。默认的月份、星期采用英文,但支持本地化(new CalendarMonths(["一月", "二月", "三月", "四月"...);该日历控件支持在单个页面中创建多个实例。

    这个控件的算法参考了 http://web-v.com/article.asp?id=3http://web-v.com/trackback.asp?tbID=3&action=addtb&tbKey=2fefac8959f18cceb46771512eff082b27e97c09 作者介绍的日历控件,但这个日历控件看上去似乎单个页面只能显示一个。

    (下载源码包(20080704))

Feedback

#1楼    回复  引用    

2008-07-03 21:33 by 银饰 [未注册用户]
收下了

#2楼    回复  引用  查看    

2008-07-04 08:18 by 张波sun      
好东西!

#3楼    回复  引用    

2008-07-04 08:23 by beamsea [未注册用户]
我顶你一下,不错的东东!学习了

#4楼    回复  引用  查看    

2008-07-04 08:31 by Q.Lee.lulu      
谢谢分享!!
楼主厚道多了,呵呵

#5楼    回复  引用    

2008-07-04 08:40 by 庞永庆 [未注册用户]
你好 我是出版社的编辑,我看到你博客中的内容,感觉写的非常好,如果想把这些内容和更多的人分享,可以和我联系,把这些东西写成书。
我的邮箱:books_522008@yahoo.com.cn

#6楼    回复  引用  查看    

2008-07-04 09:11 by Ryan Gene      
thread?

想看看thread是怎么样的。。

另外,calendar在firefox下完全不能用

#7楼 [楼主]   回复  引用  查看    

2008-07-04 11:03 by 陛下      
@Ryan Gene
真对不住,一直没有做 firefox 下的测试。不过我相信有兄弟一定能搞定这问题的。
Thread 不过是对 SetTimeOut 的包装;Timer 是对 SetInterval 的包装,没啥:)

#8楼    回复  引用    

2008-07-04 12:10 by 小白TWO [未注册用户]
ajax類好像有問題。POST數據時有設置的。

#9楼 [楼主]   回复  引用  查看    

2008-07-04 12:21 by 陛下      
@小白TWO
谢兄弟(大哥?)提醒!当初用的时候基本是“GET”,所以“POST”算是未测过的功能。但我的意图兄弟应该明白;应该说,实用性是绝对有限的,只是想提供给大家一种思想:我心目中理想的 javascript 应该是类似这样被调用的:)

#10楼    回复  引用  查看    

2008-07-04 16:16 by 赖文华(SWPU小赖)      
学习!


标题  
姓名  
主页
Email (博主才能看到) 
验证码 *  看不清,换一张 [登录][注册]
内容(请不要发表任何与政治相关的内容)  
  登录  使用高级评论  新用户注册  返回页首  恢复上次提交      
该文被作者在 2008-07-26 21:07 编辑过


相关链接: