分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 运营维护

JS实现简单日历

发布时间:2023-09-06 01:08责任编辑:彭小芳关键词:暂无标签
/* ???//api ???num : year ???num : month ???num : date ???num : day ???num : time ???data: getData() ???data: preMonth() ???data: nextMonth() ???data: preYear() ???data: nextYear() ???data: thisMonth() ???data: costomDate() ???data{isToday,isThisMonth,date}*/function Calendar(studyWeek){ ???var calendar = new Object(); ???//日期数据基础 ???calendar.baseDate = new Date(); ???//初始化 ???calendar.init = function (){ ???????this.year = this.baseDate.getFullYear(); ???????this.month = this.baseDate.getMonth(); ???????this.date = this.baseDate.getDate(); ???????this.day = this.baseDate.getDay(); ???????this.time = this.baseDate.getTime(); ???} ???calendar.init(); ???//获取数据 ???calendar.getData = function (){ ???????var data = []; ???????//起始值 ???????var date = new Date(this.year,this.month,1); ???????date.setTime(date.getTime() - 86400000 * date.getDay()); ???????do{ ???????????for(var i=0; i<7; i++){ ???????????????var obj = {}; ???????????????obj.isThisMonth = date.getMonth() == this.month? true : false; ???????????????obj.isToday = date.getDate() == this.date && date.getMonth() == new Date().getMonth() ? true : false; ???????????????obj.isWeek = i == 0 || i == 6? true : false; ???????????????obj.date = date.getDate(); ???????????????obj.month = date.getMonth() + 1; ???????????????obj.year = date.getFullYear(); ???????????????obj.weekNum = this.setWeekNum(obj); ???????????????data.push(obj); ???????????????date.setTime(date.getTime() + 86400000); ???????????} ???????} while(date.getMonth() == this.month); ???????return data; ???} ???//设置周次 ???calendar.setWeekNum = function(obj){ ???????var study = new Date(studyWeek.year, studyWeek.month, studyWeek.date).getTime(); ???????var now = new Date(obj.year, obj.month, obj.date).getTime(); ???????var weekNum = Math.ceil( (now - study) / (1000 * 60 * 60 * 24) / 7 ); ???????return weekNum + 1; ???} ???//上月 ???calendar.preMonth = function (){ ???????this.month--; ???????this.baseDate.setMonth(this.month); ???????this.init(); ???????return this.getData(); ???} ???//下月 ???calendar.nextMonth = function (){ ???????this.month++; ???????this.baseDate.setMonth(this.month); ???????this.init(); ???????return this.getData(); ???} ???//上一年 ???calendar.preYear = function (){ ???????this.year -= 1; ???????this.baseDate.setFullYear(this.year); ???????this.init(); ???????return this.getData(); ???} ???//下一年 ???calendar.nextYear = function (){ ???????this.year += 1; ???????this.baseDate.setFullYear(this.year); ???????this.init(); ???????return this.getData(); ???} ???//本月 ???calendar.thisMonth = function (){ ???????this.baseDate = new Date(); ???????this.init(); ???????return this.getData(); ???} ???//自定义年月 ???calendar.customDate = function (year,month){ ???????this.year = +year; ???????this.month = +month; ???????this.baseDate.setFullYear(this.year); ???????this.baseDate.setMonth(this.month - 1); ???????this.init(); ???????return this.getData(); ???} ???//返回值 ???return calendar;}

使用:

var calendar = new Calendar(); var data = calendar.getData(); ???

根据获取的data进行自由渲染。

JS实现简单日历

原文地址:http://www.cnblogs.com/sjzbk/p/7799571.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved