`
sjy
  • 浏览: 20380 次
  • 性别: 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简易日历特效原生代码

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

    javascript中Date对象应用之简易日历实现_.docx

    2. **计算月份的第一天是星期几**:通过`getDay()`方法可以获取指定日期是一周中的哪一天(0代表周日,1代表周一等)。根据这个值来计算第一个显示的日期应该是什么时候开始的。 3. **填充日期**:根据计算的结果来...

    js实现日历可获得指定日期周数及星期几示例分享(js获取星期几)

    要实现一个简易日历,能够让用户输入日期并得到该日期是年份中的第几周以及对应的星期几,可以通过编写一段JavaScript代码来完成。以下是根据提供的文件信息,详细解析了实现这一功能所涉及的知识点: 1. HTML界面...

    javascript中Date对象应用之简易日历实现

    通过上述步骤,我们可以构建一个基本的JavaScript简易日历。这个日历可以根据用户的输入动态生成对应年月的日历视图,为网页增加实用的日期选择功能。然而,为了实现更复杂的功能,如多语言支持、日期范围选择等,...

    输出月历的程序

    下方则是具体的日期,按照日历的常规排列,每个日期旁边可能会标注出该日期在一周中的对应星期。 对于标签“月历”、“c”和“vc 简易”,我们可以推断这个项目使用了C语言的语法和风格,并且在Visual C++ 6.0环境...

    用jsp做的一个简单的小日历源代码

    - **日期处理:** 利用`java.util.Calendar`类处理日期相关的计算,如计算某个月的第一天是星期几、当月有多少天等。 - **动态生成HTML内容:** 根据计算结果动态生成HTML表格内容,展示日历。 ##### (3) 关键代码...

    asoft签到管理系统tykq3.5_build20110125

    (在后台系统设置-&gt;常规设置可以添加想要开放签到的日期,比较适合于在一些额外的假日的时候进行便捷的调休) 3、万众期待的请假流程无限级自定义诞生了,并且,请假流程会根据申请人权限自动省略不必要的步骤...

Global site tag (gtag.js) - Google Analytics