JavaScript blog式日历控件新算法

高洛峰
Lepaskan: 2017-01-04 13:58:26
asal
1136 orang telah melayarinya

使用说明:

程序比较简单,代码中都有说明,这里说说怎么使用。 
首先是实例化一个Calendar,并设置参数。 
参数说明: 
Year:要显示的年份 
Month:要显示的月份 
SelectDay:选择日期 
onSelectDay:在选择日期触发 
onToday:在当天日期触发 
onFinish:日历画完后触发 

一般SelectDay设置成选择了的日期,并在onSelectDay中设置一个函数用来设置这个日期的样式, 
例如实例里SelectDay设置成今个月10号并在那天样式设为onSelect: 

SelectDay: new Date().setDate(10), 
onSelectDay: function(o){ o.className = "onSelect"; },
Salin selepas log masuk

而onToday就用来设置今日日期的样式,
例如实例里面把今天的日期的样式设为onToday:

onToday: function(o){ o.className = "onToday"; },
在onFinish中可以放需要设置日历的程序。
可以通过this.Year和this.Month获取当前日历显示的年份和月份。
对有数据的日期的也在这里设置,例如实例中是有一个当前月份的有数据的日期列表,然后根据这个列表对相应的日期进行设置:

var flag = [10,15,20]; 
for(var i = 0, len = flag.length; i < len; i++){ 
this.Days[flag[i]].innerHTML = "<a href=&#39;javascript:void(0);&#39; onclick=\"alert(&#39;日期是:"+this.Year+"/"+this.Month+"/"+flag[i]+"&#39;);return false;\">" + flag[i] + "</a>"; 
}
Salin selepas log masuk

实例中是固定了这个日期列表,实际应用中可以根据年份月份获取对应的日期列表,
个人推荐用年份月份通过ajax获取。

程序中还有两个有用的方法PreMonth(显示上一个月)和NextMonth(显示下一个月)。

测试代码:

 
 
 
 
blog式日历控件_www.jb51.net_脚本之家 

<<
>>
20088
Salin selepas log masuk

更多JavaScript blog式日历控件新算法相关文章请关注PHP中文网!


Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan