My97日期控件 My97 DatePicker Ver 3.0 正式版 (07-6-11)

    技术2022-05-11  89

    1.  点击年份,月份下拉的时候显示 ?/td> 答:这个问题是由于My97粗心所致,刚刚发布一个小时内下载的朋友,都有这个问题,打开 calendar.js里面有两处?/td>替换为×</td>

    2. 多框架时,其他框架里点的链接替换了本页,时间框不会消失答: 此问题已经修正    从这个地址(一定要这个地址):    http://www.waytop.net/my97/datepicker/My97DatePicker3.0.rar    重新下载,文件包,替换一下

    3.在ff下,看着是正常的,但在错误查看器里每点击一次,就会记一个错误,错误地址是:错误: this.win.attachEvent is not a function源文件:file:///F:/My97DatePicker3.0/My97DatePicker3.0/My97DatePicker/WdatePicker.js行:128答:此问题已经修正从这个地址(一定要这个地址):    http://www.waytop.net/my97/datepicker/My97DatePicker3.0.rar    重新下载,文件包,替换一下

    '=================================================

    本控件无偿免费的提供大家交流使用,里面的JS没有经过任何加密,发布时间是2007-6-11,如果您觉得这个控件好的话,希望能帮忙在各大论坛转贴,万分感谢!

    3.0正式版更新和修正的内容1.优化了速度和内存占用2.增加realValue 的格式设置3.增强日期范围限制可以使用#Year# #Month# #Day# #lastDay#如:本月最后一天#Year#-#Month#-#lastDay#明年今天(注意有运算的地方,比如+1,必须用{}) : {#Year#+1}-#Month#-#Day#函数 #F{function}比如用另一个框(id是test1)的值作为最小日期,则 MINDATE="#F{$('test1').value}"4.当日期格式设置为 %h:%m:%s 只有时间选择了5.增加年份月份导航,增加清空按钮6.增加显示位置设置(上面 下面 自动(默认))7.增加文件包路径设置(在wdatepicker.js文件里,默认为空,程序会自动计算路径)8.增加自定义触发事件,可以在日期框添加属性 onpicked="function(){}" 来自定义触发事件9.增加多语言自动选择功能,系统会根据用户浏览器语言自动选择 简体 繁体 和英文修正抖屏修正在XHTML 1.0下不兼容的问题修正2007-3-31 修改成2月份时变为2007-2-31的bug修正frame中跳转时没销毁的bug修正css路径,不必将文件包放根目录下了

     

    下载之前顶一下我在发表的帖子哦,万分感谢!http://community.csdn.net/Expert/topic/5593/5593257.xml?temp=.4757044

    演示地址:http://www.waytop.net/my97/datepicker/3.0/demo/index.htm下载地址:http://www.waytop.net/my97/datepicker/My97DatePicker3.0.rar

    主机不稳定,如果上面的地址进不去,您也可以到这里下载:

    下载地址2:http://download.csdn.net/source/197114

    '=============================================

    特别提醒:2.1版本是一次重要的更新,推荐原2.0用户升级,2.1版本是完全兼容2.0的,所以升级方法很简单,只要用2.1的文件覆盖原2.0对于文件即可,在调用的地方不需要做任何修改

    /***************************************************** * 2.1版更新说明(2.1是一次很重要的更新)* 日期范围限制,可以在选择框指定MINDATE和MAXDATE属性来限制日期范围* 增强的自动纠错功能,纠错处理可设置为3种模式 1.提示(默认) 2.自动纠错 3.标记* 2.0版更新说明* 支持两种调用方式* 支持自定义皮肤和动态切换皮肤(感谢why提供whyGreen皮肤)** 跨越框架显示选择框* 自动提示日期错误* 年份,月份设置为选择模式* 支持日期和时间的编辑,编辑时自动跳转到对应月份和时间* 根据网页大小自动选择显示位置* 支持时间选择* 自定义日期时间格式* 支持多国语言设置* 支持周末加亮设置* 完美支持FireFox,在FF中的效果跟IE一模一样* ---------------------------------------------------* 修正非WINDOWS主机下,路径错误的问题* 修正子框架刷新后浏览器报错为不能执行已释放的Script代码的问题* ---------------------------------------------------* 联系My97:* 如果您在使用过程中遇到问题,或者有更好的建议* 欢迎您访问* BLOG: http://blog.csdn.net/my97/* MAIL: smallcarrot@163.com****************************************************/

    回应要求加入清空按钮的朋友:清空按钮没有加入的有以下两个个原因,希望能得到你的谅解:1 当某个日期值是必填字段的时候,在设计的时候会把日期框改为只读,只能让用户选择日期,加了清空按钮反而不好2 当某个日期值是非必填字段的时候,在设计时日期框是支持用户输入的,用户将日期框的值删除也达到了清空的目的而且操作也不繁琐.

    基本使用:1. 在使用该日期控件的文件中加入JS库, 代码如下 <script language="javascript" type="text/javascript" src="datepicker/WdatePicker.js"></script>

    2. 在使用该日期控件的文件加载css样式 <link href="datepicker/default/datePicker.css" rel="stylesheet" type="text/css" />

    3. 在input标签里面加上(.net上是CssClass) class="Wdate" 注意:这个是对日期框的样式定义,如果你自己已经对日期框的样式定义了,此步可以不做

    4.加上主调函数 οnfοcus="new WdatePicker('el','dateFmt','showsTime','skin')"

    相信大家已经知道这么用了,如果还不明白请QQ我:9589876

    .Net中使用的注意事项由于.Net中默认适用的是utf编码的所以会因为编码问题而不能使用,在引用的时候稍微有点变化<script language="javascript" type="text/javascript" src="datepicker/WdatePicker.js"></script><link href="datepicker/default/datePicker.css" rel="stylesheet" type="text/css" />改为:<script language="javascript" type="text/javascript" src="datepicker/WdatePicker.js" charset="gb2312"></script><link href="datepicker/default/datePicker.css" rel="stylesheet" type="text/css" charset="gb2312"/>

    繁體版用戶注意事項:可能你們的機器上沒有安裝簡體中文,那么你需要把charset="gb2312"改為charset="GBK",另外:你需要修改默認設置里面的語言設置,把對應的簡體中文改成繁體中文

    主调函数的使用方法和说明1.主调方法:class="Wdate" ----> 日期框的样式,你可以根据具体的项目自己更改日期框的样式,比如长度,高度颜色等 οnfοcus="new WdatePicker('el','dateFmt','showsTime','skin')"这个是JS库的主调函数:el: 表示返回日期的对象或对象名称,提供2种调用方式dateFmt: 自定义的日期格式 %Y %M %D %h %m %s 表示年月日时分秒(注意大小写) 默认是%Y-%M-%DshowsTime: 布尔型变量 true表示带时间选择 默认为falseskin: 皮肤的名称 本包自带2款皮肤 分别为 default 和 whyGreen2.属性(2.1新增,注意大小写)MINDATE: 日期最小值 格式为: 2000-1-1 或 2000/1/1 默认为:1900-1-1MAXDATE: 日期最大值 格式为: 2008-1-1 或 2008/1/1 默认为:2099-12-303 改进的方法getValue(): 这个属性用于记录日期框的日期值 通常情况下getValue()和 日期框的value 属性是一样的,当进行自定义日期格式的时候这2个值就不一样了例如: 当 格式字符串: %Y年%M月%D日 %h时%m分%s秒 时 日期框中的VALUE是:2000年1月1日 12时00分00秒 而getValue()值: 2000-1-1 12:00:00我想通过这个例子应该很清楚了,2000年1月1日 12时00分00秒对于用户来说是一个很直观的日期,但对于计算机来说是一个不可识别的日期,在用户选择的时候我们可以使用%Y年%M月%D日 %h时%m分%s秒格式化日期给用户一个友好的日期格式,但是在数据存储的时候我们不可能把2000年1月1日 12时00分00秒直接存入数据库的,getValue()就是为了解决这个问题而设计的.相关的例子请参考下面贴出的特性演示地址

    默认设置的更改和相关说明默认设置和相关参数的更改在WdatePicker.js最上面几行,用代码说话/* 设置 */var dpcfg = {};/* 默认风格 如果你喜欢whyGreen这个样式,你可以改成whyGreen 另外你还可以自定义自己的样式 */dpcfg.skin = "default"; /* 日期格式 %Y %M %D %h %m %s 表示年月日时分秒(注意大小写) */dpcfg.dateFmt = "%Y-%M-%D";/* 是否显示时间 */dpcfg.showTime = false; /* 是否高亮显示 周六 周日 */dpcfg.highLineWeekDay = true;/* 日期范围 */dpcfg.minDate = "1900-1-1";dpcfg.maxDate = "2099-12-30";/* 纠错模式设置 可设置3中模式 0 - 提示 1 - 自动纠错 2 - 标记 */dpcfg.errDealMode = 0;/* 纠错提示信息,仅当提示提示模式为0时有效 */dpcfg.errAlertMsg = "不合法的日期格式或者日期超出限定范围,需要撤销吗?";/* 语言设置 */dpcfg.aWeekStr = ["日","一","二","三","四","五","六"];dpcfg.aMonStr = ["一月","二月","三月","四月","五月","六月","七月","八月","九月","十月","十一","十二"];dpcfg.todayStr = "今天";dpcfg.okStr = "确定";dpcfg.timeStr = "时间";dpcfg.monthStr = "月份";dpcfg.yearStr = "年份";

    自定义皮肤的相关说明皮肤是可以自定义的,1. 皮肤名字就是皮肤文件夹名2. 皮肤用到的图片和其他资源必须放在皮肤文件夹内3. CSS文件的名字必须是:datepicker.css

    以whyGreen皮肤为例:用代码说话

    /* * My97日期控件 My97 DatePicker Ver 2.0* 皮肤名称:whyGreen* 皮肤作者:why* 作者主页:www.nbycstudio.com*/

    /* 日期选择控件 */.Wdate{width:140px;border:#999 1px solid;background:url(../datePicker.gif) no-repeat right;}/* 日期选择控件 日期格式错误时的CSS */.WdateFmtErr{font-weight:bold;color:red;}/* 日期选择容器 DIV */.WdateDiv{width:180px;background-color:#fff;border:#C5E1E4 1px solid;padding:2px;}.WdateDiv *{font-size:9pt;}/***************************** 年份月份相关***************************//* 年份月份栏 DIV */.WdateDiv #dpTitle{height:24px;border:#c5d9e8 1px solid;color:#70A5AB;background:url(bg.jpg);margin-bottom:2px;}/* 年份月份输入框 INPUT */.WdateDiv .yminput{padding-top:2px;text-align:center;border:0px;height:16px;color:#034c50;background:url(ymbg.jpg);cursor:pointer;}/* 年份月份输入框获得焦点时的样式 INPUT */.WdateDiv .yminputfocus{text-align:center;font-weight:bold;color:#034c50;border:#939393 1px solid;height:16px;}/* 年份月份选择框 DIV */.WdateDiv .ymsel{position:absolute;margin-left:24px;top:23px;background-color:#FFFFFF;padding:2px;border:#A3C6C8 1px solid;display:none;}/* 年月选择框的样式 TD */.WdateDiv .Wym{cursor:pointer;background-color:#fff;color:#11777C;}/* 年月选择框的mouseover样式 TD */.WdateDiv .WymOn{cursor:pointer;background-color:#BEEBEE;}/* 年月选择框无效时的样式 TD */.WdateDiv .Winvalidym{color:#aaa;}/***************************** 星期,日期相关***************************//* 日期栏表格 TABLE */.WdateDiv #dpDayTable{line-height:20px; color:#13777e;background-color:#edfbfb;border:#BEE9F0 1px solid;}/* 星期栏 TR */.WdateDiv #dpWeekTitle{color:#13777e;background-color:#bdebee;}/* 日期格的样式 TD */.WdateDiv .Wday{cursor:pointer;}/* 日期格的mouseover样式 TD */.WdateDiv .WdayOn{cursor:pointer;background-color:#74d2d9 ;}/* 周末日期格的样式 TD */.WdateDiv .Wwday{cursor:pointer;color:#ab1e1e;}/* 周末日期格的mouseover样式 TD */.WdateDiv .WwdayOn{cursor:pointer;background-color:#74d2d9;}/* 今天的样式 */.WdateDiv .Wtoday{cursor:pointer;color:blue;}/* 已选择那天的样式,即日期框中日期所对应的样式 */.WdateDiv .Wselday{color:red;background-color:#B3E6EA;}/* 无效日期的样式,即在日期范围以外日期格的样式,不能选择的日期 */.WdateDiv .WinvalidDay{color:#aaa;}/***************************** 时间相关***************************//* 时间栏 DIV */.WdateDiv #dpTime{}/* 时间文字 SPAN */.WdateDiv #dpTime #dpTimeStr{margin-left:1px;color:#497F7F;}/* 时间输入框 INPUT */.WdateDiv #dpTime input{height:16px;width:18px;text-align:center;color:#333;border:#61CAD0 1px solid; }/* 时间 时 INPUT */.WdateDiv #dpTime .tB{border-right:0px;}/* 时间 分和间隔符 ':' INPUT */.WdateDiv #dpTime .tE{border-left:0;border-right:0;}/* 时间 秒 INPUT */.WdateDiv #dpTime .tm{width:7px;border-left:0;border-right:0;}/* 时间右边的向上按钮 BUTTON */.WdateDiv #dpTime #dpTimeUp{height:10px;width:13px;border:0px;background-image:url(up.jpg);}/* 时间右边的向下按钮 BUTTON */.WdateDiv #dpTime #dpTimeDown{height:10px;width:13px;border:0px;background-image:url(down.jpg);}/***************************** 其他***************************//* 确定和几天按钮 INPUT */.WdateDiv #dpOkInput{border:#38B1B9 1px solid;height:16px;background-color:#CFEBEE;color:#08575B;}

    下载之前顶一下我在发表的帖子哦,万分感谢!http://community.csdn.net/Expert/topic/5310/5310759.xml?temp=.803097

    演示地址:http://www.waytop.net/my97/datepicker/2.1/demo2.1.html下载地址:http://www.waytop.net/my97/datepicker/My97DatePicker2.1.rar

    联系My97:

    **************************************************** * 如果您在使用过程中遇到问题,或者有更好的建议* 欢迎您访问* BLOG: http://blog.csdn.net/my97/* MAIL: smallcarrot@163.com****************************************************/

    修正2.1版本中,最小日期和最大日期限制在同年同月时的显示问题 

    2.1版本中当最大和最小日期限制在同年同月时,日期面板上没有正确的灰掉不能选择的日期,现在这个问题已经修复了.

    修复包:(里面只有一个WdatePicker.js文件,下载后替换同名文件[注:如果你修改过默认配置,请重新配置]) http://www.waytop.net/my97/datepicker/WdatePicker2.1.1.rar

    完整包:http://www.waytop.net/my97/datepicker/My97DatePicker2.1.rar

    http://www.cnblogs.com/my97/archive/2007/01/22/626749.html

    http://www.cnblogs.com/my97/category/82728.html 


    最新回复(0)