当前位置：首页 > 全部内容 > 正文

JavaScript实现按周数计算日期范围及2月边界Bug处理

作者：小括号

时间：2026-10-30

浏览：159

本文介绍使用JavaScript根据用户选择的年份、月份及周数计算该周开始与结束日期的方法。核心逻辑以当月1号的星期几为基准推算各周日期。重点解决了当2月1日为周一且为平年时，第5周跨入3月导致的显示异常问题，并提供了两种修正方案：强制切换月份或限制周数选择。

文章目录

周数计算逻辑与实现

在最近的一个项目查询页面开发中，遇到了一个具体需求：用户需要输入年份、月份以及周数，系统需返回该周的具体起始日期和结束日期。经过网络搜索未发现完全匹配的实现方案，因此决定自行编写代码。基本思路是首先获取所选年月1号是星期几，以此为基础计算出该周周一的日期。

确定周一日期后，即可推算出后续周数的起止时间。第1周的结束日期为周一日期加6天，第2周的开始日期为周一日期加7天，结束日期为周一日期加13天，依此类推，直至计算出第5周的起始和结束日期。

具体实现代码如下：

核心代码实现


//该方法有两个参数，date是给定的日期型参数，days是需要在该日期进行加减的天数。 
//例如，add(2010-10-01,-3)返回从2010-10-01这一天往前退3天的日期即2010-09-28 
function addDate(date,days){ 
var d=new Date(date); 
d.setDate(d.getDate()+days); 
var m=d.getMonth()+1; 
var tmpDate = d.getFullYear()+ "/" + m + "/" + d.getDate(); 
var resultDate = new Date(tmpDate); 
return resultDate; 
} 
//对选择的年月转换为YYYY-MM-dd的格式 
function changeDateFormat(DateIn){ 
var year = 0; 
var month = 0; 
var Day = 0; 
var currentDate = ""; 
year = DateIn.getYear(); 
month = DateIn.getMonth() + 1; 
Day = DateIn.getDate(); 
currentDate = year + "-"; 
if(month > 10){ 
currentDate = currentDate + month + "-"; 
}else{ 
currentDate = currentDate + "0" + month + "-"; 
} 
if(Day > 10){ 
currentDate = currentDate + Day; 
}else{ 
currentDate = currentDate + "0" + Day; 
} 
return currentDate; 
} 
//根据选择的周计算出本周的开始日和结束日 
function weekToDate(weekNumber,strWeekDay,dateIn){ 
//输出的开始日 var outputDate_1 = ""; 
//输出的结束日 var outputDate_2 = ""; 
var tmp_date= ""; 
//如果选择的年月1号这一天恰好为sunday，该周monday的日期为这一天的日期-6 
if(strWeekDay == '0'){ 
outputDate_1 = addDate(dateIn,-6); 
} 
//如果选择的年月1号这一天为monday,第二个参数设为0，以下以此类推。 
if(strWeekDay == '1'){ 
outputDate_1 = addDate(dateIn,0); 
} 
if(strWeekDay == '2'){ 
outputDate_1 = addDate(dateIn,-1); 
} 
if(strWeekDay == '3'){ 
outputDate_1 = addDate(dateIn,-2); 
} 
if(strWeekDay == '4'){ 
outputDate_1 = addDate(dateIn,-3); 
} 
if(strWeekDay == '5'){ 
outputDate_1 = addDate(dateIn,-4); 
} 
if(strWeekDay == '6'){ 
outputDate_1 = addDate(dateIn,-5); 
} 
if(weekNumber == '1'){ 
outputDate_2 = dateIn; 
} 
if(weekNumber == '2'){ 
outputDate_2 = addDate(outputDate_1,+7); 
} 
if(weekNumber == '3'){ 
outputDate_2 = addDate(outputDate_1,+14); 
} 
if(weekNumber == '4'){ 
outputDate_2 = addDate(outputDate_1,+21); 
} 
if(weekNumber == '5'){ 
outputDate_2 = addDate(outputDate_1,+28); 
} 
if(weekNumber == '1'){ 
//第1周的开始日结束日计算基点都是outputDate_1,因此单独判断 
document.getElementById("spnDate").value = changeDateFormat(outputDate_1); 
temp_date = addDate(outputDate_1,+6); 
document.getElementById("finishTime").value =changeDateFormat(temp_date); 
}else{ 
//第2周以后的开始日结束日都以outputDate_2为计算基点 
document.getElementById("spnDate").value = changeDateFormat(outputDate_2); 
temp_date = addDate(outputDate_2,+6); 
document.getElementById("finishTime").value =changeDateFormat(temp_date); 
} 
} 
function getFromToDateOfSelectedWeek(){ 
var year = document.getElementById("sltYear"); 
var optionYear=year.getElementsByTagName("option"); 
var strYear = "" ; 
for(var i=0;i<optionYear.length;++i) 
{ 
if(optionYear[i].selected){ 
strYear = optionYear[i].text; 
} 
} 
var month = document.getElementById("sltMonth"); 
var option = month.getElementsByTagName("option"); 
var strMonth = "" ; 
for(var i=0;i<option.length;++i) 
{ 
if(option[i].selected){ 
strMonth = option[i].text; 
} 
} 
//根据选择的年月，组合成yyyy/mm/01的日期字符串 
var sltDate_tmp_0 = strYear+ "/" + strMonth + "/" + "1"; 
//将日期字符串转换为日期型 
var sltDate_tmp_1 = new Date(sltDate_tmp_0); 
//取得该月1号所在的星期数 
var weekDay = sltDate_tmp_1.getDay(); 
//获取页面选择的周数 
var weekNumber = document.getElementById("weekNumber"); 
var optionWeek=weekNumber.getElementsByTagName("option"); 
var strWeek = "" ; 
var tmp_date= ""; 
var outputDate_1 = ""; 
var outputDate_2 = ""; 
for(var i=0;i<optionWeek.length;++i) 
{ 
if(optionWeek[i].selected){ 
strWeek = optionWeek[i].text; 
} 
} 
//选择第1周时计算该年月1号这一天为monday到sunday各种可能性，返回该周monday到sunday的日期 
//以下判断以此类推 
if(strWeek == '1'){ 
if(weekDay == '0'){ 
weekToDate(strWeek,'0',sltDate_tmp_1); 
} 
if(weekDay == '1'){ 
weekToDate(strWeek,'1',sltDate_tmp_1); 
} 
if(weekDay == '2'){ 
weekToDate(strWeek,'2',sltDate_tmp_1); 
} 
if(weekDay == '3'){ 
weekToDate(strWeek,'3',sltDate_tmp_1); 
} 
if(weekDay == '4'){ 
weekToDate(strWeek,'4',sltDate_tmp_1); 
} 
if(weekDay == '5'){ 
weekToDate(strWeek,'5',sltDate_tmp_1); 
} 
if(weekDay == '6'){ 
weekToDate(strWeek,'6',sltDate_tmp_1); 
} 
} 
if(strWeek == '2'){ 
if(weekDay == '0'){ 
weekToDate(strWeek,'0',sltDate_tmp_1); 
} 
if(weekDay == '1'){ 
weekToDate(strWeek,'1',sltDate_tmp_1); 
} 
if(weekDay == '2'){ 
weekToDate(strWeek,'2',sltDate_tmp_1); 
} 
if(weekDay == '3'){ 
weekToDate(strWeek,'3',sltDate_tmp_1); 
} 
if(weekDay == '4'){ 
weekToDate(strWeek,'4',sltDate_tmp_1); 
} 
if(weekDay == '5'){ 
weekToDate(strWeek,'5',sltDate_tmp_1); 
} 
if(weekDay == '6'){ 
weekToDate(strWeek,'6',sltDate_tmp_1); 
} 
} 
if(strWeek == '3'){ 
if(weekDay == '0'){ 
weekToDate(strWeek,'0',sltDate_tmp_1); 
} 
if(weekDay == '1'){ 
weekToDate(strWeek,'1',sltDate_tmp_1); 
} 
if(weekDay == '2'){ 
weekToDate(strWeek,'2',sltDate_tmp_1); 
} 
if(weekDay == '3'){ 
weekToDate(strWeek,'3',sltDate_tmp_1); 
} 
if(weekDay == '4'){ 
weekToDate(strWeek,'4',sltDate_tmp_1); 
} 
if(weekDay == '5'){ 
weekToDate(strWeek,'5',sltDate_tmp_1); 
} 
if(weekDay == '6'){ 
weekToDate(strWeek,'6',sltDate_tmp_1); 
} 
} 
if(strWeek == '4'){ 
if(weekDay == '0'){ 
weekToDate(strWeek,'0',sltDate_tmp_1); 
} 
if(weekDay == '1'){ 
weekToDate(strWeek,'1',sltDate_tmp_1); 
} 
if(weekDay == '2'){ 
weekToDate(strWeek,'2',sltDate_tmp_1); 
} 
if(weekDay == '3'){ 
weekToDate(strWeek,'3',sltDate_tmp_1); 
} 
if(weekDay == '4'){ 
weekToDate(strWeek,'4',sltDate_tmp_1); 
} 
if(weekDay == '5'){ 
weekToDate(strWeek,'5',sltDate_tmp_1); 
} 
if(weekDay == '6'){ 
weekToDate(strWeek,'6',sltDate_tmp_1); 
} 
} 
if(strWeek == '5'){ 
if(weekDay == '0'){ 
weekToDate(strWeek,'0',sltDate_tmp_1); 
} 
if(weekDay == '1'){ 
weekToDate(strWeek,'1',sltDate_tmp_1); 
} 
if(weekDay == '2'){ 
weekToDate(strWeek,'2',sltDate_tmp_1); 
} 
if(weekDay == '3'){ 
weekToDate(strWeek,'3',sltDate_tmp_1); 
} 
if(weekDay == '4'){ 
weekToDate(strWeek,'4',sltDate_tmp_1); 
} 
if(weekDay == '5'){ 
weekToDate(strWeek,'5',sltDate_tmp_1); 
} 
if(weekDay == '6'){ 
weekToDate(strWeek,'6',sltDate_tmp_1); 
} 
} 
}

2月第5周边界Bug及处理方案

经过测试发现一个潜在Bug：当2月1日是星期一，且所选年份为平年时，若用户选择2月的第5周，计算出的第5周起始日实际上已跨入3月。例如，选择2010年2月第5周时，程序会错误地显示2010-03-1至2010-03-07。

针对上述Bug，提供两种解决思路。第一种方案是当用户选择第5周时，强制将月份下拉框的值设定为3月。第二种方案是当选择第5周时，强制将周下拉框的值设定为第4周，并显示2010-02-22至2010-02-28的日期范围。

测试中发现一个Bug：当2月1日是星期一且年份为平年时，选择2月的第5周，此时第5周的起始日实际上已经是3月而非2月。

例如，当选择2010年2月第5周时，程序会显示2010-03-1至2010-03-07。

解决方法有两种：一是当用户选择第5周时，把月份下拉框强制设定到3月；二是将周下拉框强制设定到第4周，并显示2010-02-22至2010-02-28。

经过测试有一个bug，当2月1日是星期一并且选择的年份是平年时，选择2月的第5周，此时第5周的开始日已经是3月而不是2月了。

例如，选择2010年2月第5周此时，程序会显示2010-03-1至2010-03-07。

解决方法有两种，一是当用户选择第5周时把月份下拉框强制设定到3月。二是，将周下拉框强制设定到第4周上，并且显示2010-02-22至2010年02-28。

以上介绍的是基于JavaScript实现通过选择周数显示开始日和结束日的代码，希望能对开发者有所帮助。

实用工具推荐

电子包浆

绿化、压缩、噪点和虚拟水印，自由调节做旧程度。

使用 ›
图片压缩

选择画质和输出格式，预览压缩前后的大小。

使用 ›
作者最新文章

JS语法错误会阻止加载吗？区分SyntaxError与资源加载失败

JavaScript常见SyntaxError语法错误排查与修复方法

JS中slice、substring和substr截取字符串的区别

JS 转 TS 手动迁移最佳实践：从配置 tsconfig 到消除 any 类型

为什么JS数组push后得到的是数字而不是数组？

JavaScript根据日期获取周范围
相关文章
热门文章
更多
CSS text-transform与JS修改首字母大写的适用场景区别
JS中constructor属性判断数组存在哪些风险
JS正则替换中$1捕获组引用与字符串重组技巧
全栈开发中JavaScript与Java怎么协作？前后端技术栈配合解析
Node.js后端生成高强度随机字符串的方法
怎么在本地运行JavaScript脚本：Node.js下载安装与环境配置教程
JS正则表达式基础：字面量与RegExp构造函数的区别及常用元字符
JS 解压出现乱码或报错怎么解决？
JavaScript常见SyntaxError语法错误排查与修复方法
JavaScript实现按钮点击冷却时间的完整代码示例