`
sjy
  • 浏览: 19985 次
  • 性别: Icon_minigender_1
  • 来自: 南京
社区版块
存档分类
最新评论

JS写的简易日历显示指定日期在该年第几周星期几

阅读更多



     需求来自一个朋友:编写一个简易日历。在文本框中输入要查找的日期,程序可以计算出这一天处在该年份的第几周,并且能判断出这一天到底是星期几。

 

      应为要有交互,选择了Js来实现,也算是 结对编程 初试吧。 我将显示部分用html 写好,点击的按钮触发事件函数是check();    

 

function onCheck(){ 
var Year = document.getElementById("year").value; //获取文本框的“年” var theYear =Year * 1; //转换为number类型 //alert(theYear); // 获取月值 
var month = document.getElementById("month"); 
var index1=month.selectedIndex; var theMonth = month.options[index1].value; //获取月值 
var day = document.getElementById("day"); 
var index2=day.selectedIndex; 
var theDay = day.options[index2].value;

// 输入值判断部分
...
//调用核心函数
days(theYear,theMonth,theDay); 
}

核心函数days如下: 

function days(year,month,day) { 
	var days = 0;  //表示改日期为当年的第几天
	//累加月天数
	for(var i = 1; i < month; i++ ){
	switch(i){
	//大月的情况加31
	case 1:
	case 3:
	case 5:
	case 7:
	case 8:
	case 10:
	case 12:{
	days += 31;
	break;
	}
	//小月的情况加30
	case 4:
	case 6:
	case 9:
	case 11:{
	days += 30;
	break;
	}
	//二月的情况,根据年类型来加
	case 2:{
		if(isLeapYear(year)){
		days += 29; //闰年加29
		}
		else {
		days += 28;
		}
	break;
	}
	}
}
	  day = day * 1;
	  days += day;  //月天数之和加上日天数

    var date0 = new Date(year,0,1);   //当年的第一天是周几
//   alert(date0.getDay());
    var date1 = new Date(year,month-1,day); //将日期值格式化,0-11代表1月-12月;
//   alert((days + date0.getDay()+6)/7);
    var nthOfWeek = Math.floor((days + date0.getDay()+6)/7);  //向下取整
//   alert(nthOfWeek);
    var toDay = new Array("星期天","星期一","星期二","星期三","星期四","星期五","星期六"); 
    //day.getDay();根据Date返一个星期中的某其中0为星期日 
    alert("该日期是一年中的第"+days+"天\n"+"     是第"+nthOfWeek+"周的"+toDay[date1.getDay()]);
}

    调试过程中遇到了许多意外的错误,如类型的不匹配带来的计算错误,如数字的舍入问题;

在队友的协助下,他负责审核和协助抓虫子,我负责实施和编码;

    在最后一个环节,对输入值的测试中,我们很好的相互协助,分析不同的输入情况,涵盖了各种可能的意外,很快的完成了功能的完善;

下面是对输入值的判断是否允许的 代码 :


 

if (isNaN(theYear)|| theYear < 0) {
  alert("输入有误,请重新输入");
  return ;
}

if((theMonth == 2 && theDay > 29 && isLeapYear(theYear))||(theMonth == 2 && theDay > 28 && !isLeapYear(theYear))) {
  alert("输入有误,请重新输入");
  return ;
} 

if((theMonth == 4 || theMonth == 6 || theMonth == 9 || theMonth == 11) && theDay == 31 ) {
  alert("输入有误,请重新输入");
  return ;
} 

 

 

分享到:
评论

相关推荐

    JS获取当天是本年的第几周和本周的起始日期

    在JavaScript中,获取当前日期是本年的第几周以及本周的起始日期是一个常见的需求,特别是在日历应用或者数据分析中。下面将详细解释如何通过JS实现这个功能,并且考虑到周的起始日期可以自定义,这里设定为礼拜四...

    周日历js插件,weeklyCalendar,只显示一周的日期

    《周日历js插件——weeklyCalendar:专为一周日期展示设计》 在现代Web开发中,日历插件是不可或缺的一部分,它们为用户提供了直观的时间管理方式。本文将深入探讨一个专注于一周日期显示的JavaScript插件——...

    用mfc编写的日历,输入日期,显示星期。包含简单的控件添加

    在本文中,我们将深入探讨如何使用Microsoft Foundation Class (MFC) 库来编写一个日历应用程序,该程序能够接收用户输入的日期,并显示相应的星期。MFC是Microsoft为Windows平台开发C++应用的一个强大框架,它封装...

    js版简易日历

    用js动态生成日历位置,闭包控制点击后出现的时间。

    Js双日历控件,同时显示两个日期选择器

    Js双日历控件,在一个网页上同时显示两个日期选择器,写成了封装类,方便使用者调用。同时美化的相当不错。  包括了以下函数:  1、2012——2020年节假日信息(包括节假日前1~3天/后1~3天)  2、格式化数字,...

    日历查看课程(支持从指定日期开始显示日历)

    标题 "日历查看课程(支持从指定日期开始显示日历)" 暗示了这是一个关于开发具有特定功能的日历视图的应用程序或组件。这个日历不仅展示日期,还能根据用户需求从指定的日期开始展示,这在教育、计划管理或者时间...

    js简易日历插件

    总的来说,"js简易日历插件"是一个方便开发者快速添加日期选择功能的工具,它通过JavaScript和CSS实现了动态显示和用户交互。理解其基本原理和使用方法,有助于你在网页开发中更高效地集成这一功能。同时,这个插件...

    js简易日历特效原生代码

    "js简易日历特效原生代码"的标题暗示了我们将探讨如何利用纯JavaScript实现一个基本的日历功能,无需依赖任何外部库,如jQuery或其他日期管理库。 首先,让我们了解JavaScript中的日期处理。JavaScript内置了一个`...

    输入星期显示日历

    【标题】"输入星期显示日历"涉及到的编程任务是创建一个程序,用户可以输入一个年份和该年第一天的星期几(例如,1代表星期一,2代表星期二等),然后程序会在控制台显示出该年的完整日历。这个任务需要结合日期处理...

    js 简易的日历控件

    在本案例中,我们讨论的是一个“js简易的日历控件”,它旨在提供类似于QQ邮箱中简洁版日历的功能,适合作为网页左下角或后台管理页面欢迎界面的一部分。这个通用版日历控件设计简洁,易于集成,能够增强用户体验。 ...

    CocosCreator开发简易日历

    在这个"简易日历"项目中,开发者利用CocosCreator的特性,构建了一个类似电脑桌面日历的应用。尽管这个日历可能不包含所有传统日历的功能,但它展示了如何在CocosCreator中实现基本的时间管理和用户界面设计。 首先...

    js 日历 js日历 例子 javascript日历

    JavaScript日历是一个常见的网页交互元素,它为用户提供了一个方便的方式来选择日期,常见于表单填写、事件安排等场景。在Web开发中,JavaScript日历组件的实现主要依赖于JavaScript语言和CSS来完成页面布局和样式...

    用JS写的日历 很好用的日历

    在网页开发中,JavaScript(JS)经常被用来增强用户体验,其中一种常见的应用就是创建交互式的日历控件。本文将详细讲解如何使用JavaScript编写一个功能丰富的日历组件,并探讨其在HTML页面中的应用。 首先,...

    将指定的日期转换为星期

    在这个特定的问题中,我们需要实现一个功能,让用户通过下拉列表选择输入指定的日期,然后系统将其转换为对应的星期数。这个过程涉及到编程语言中的日期处理函数和数据类型。 首先,我们要理解日期和星期之间的关系...

    ABAP日期函数(求月末日,第几周,search help 只显示年月) 使用方法实例

    在实际应用中,日期函数的使用非常广泛,例如计算两个日期间的工作天数、获取当前月份的第一天和最后一天、计算日期所在的周数、弹出选择周的对话框等。 1. 计算两个日期间的工作天数 在实际应用中,我们需要计算...

    一个js写的日历控件

    在IT行业中,JavaScript(简称JS)是一种广泛使用的前端编程语言,尤其在网页交互和动态效果的实现上。在这个场景中,我们讨论的是一个用JS编写的日历控件,其目的是为了帮助用户在预订酒店时方便地选择入住日期和离...

    js酒店价格日历_js门票价格日历_javascript价格日历

    详细请参考驴妈妈 酒店和门票的价格日历。 index.html 入口文件 data.php 包含一个价格日历生成类和 一些实例 product.php ajax产品的json格式 style 样式和js文件 说明: 此程序中js是驴妈妈上的,我做了些修改,...

    自定义日历控件 支持左右无限滑动 周月切换 标记日期显示 自定义显示效果跳转到指定日期

    本文将深入探讨如何实现一个自定义的日历控件,支持左右无限滑动、周月切换、标记日期显示以及自定义显示效果,并能够跳转到指定日期。 首先,我们关注的是自定义日历的样式。自定义日历控件允许开发者根据应用的...

    4年日历表(2012年2013年2014年2015年) 带第几周

    四年日历表(2012年2013年2014年2015年) 带第几周, 万历表, 办公用

    用c写的一个简易日历

    【标题】:“用C语言编写的一个简易日历” 在编程领域,C语言是一种基础且强大的编程语言,常用于系统编程、软件开发以及教学。本项目是利用C语言实现的一个简单的日历程序,对于初学者来说,这是一个很好的学习...

Global site tag (gtag.js) - Google Analytics