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

js动态操作select,按周得到workday工作日的日期段即每月的周一到周五

 
阅读更多

最近一个项目需要统计每周的工作情况,需要一个select列表,可以选择填写某个周的工作情况。option列表是根据前面选择的年份月份动态显示的。将选择的月份按周去掉周六日显示周一到周五的日期。设计如下:

					<select id="cyear" onchange="showWorkday()">
						<option value="2012">2012</option>
						<option value="2013">2013</option>
						<option value="2014">2014</option>
						<option value="2015">2015</option>
						<option value="2016">2016</option>
						<option value="2017">2017</option>
						<option value="2018">2018</option>
						<option value="2019">2019</option>
						<option value="2020">2020</option>
						<option value="2021">2021</option>
						<option value="2022">2022</option>
					</select> 
					<select id="cmonth" onchange="showWorkday()">
						<option value="1">1</option>
						<option value="2">2</option>
						<option value="3">3</option>
						<option value="4">4</option>
						<option value="5">5</option>
						<option value="6">6</option>
						<option value="7">7</option>
						<option value="8">8</option>
						<option value="9">9</option>
						<option value="10">10</option>
						<option value="11">11</option>
						<option value="12">12</option>
					</select> 
					<select id="cworkday">
					</select>


function showWorkday(){
		 $("#cworkday").html("");//先将显示周日期的列表清空
		var year=document.getElementById('cyear').value;//得到选择的年份
		var month=document.getElementById('cmonth').value;//得到月份
		var date = new Date();
		date.setFullYear(year);
		date.setMonth(month-1);//当前月-1
		date.setDate(1);
		var weeknumber = date.getDay();//该月第一天是星期几
		//alert(weeknumber);
		var monthday=30;//此月的天数,默认30
		if(month==1||month==3||month==5||month==7||month==8||month==10||month==12){//每月多少天
		 monthday=31;
		}
		if(month==4||month==6||month==9||month==11){
		 monthday=30;
		}
		if(month==2){
		if((year%4==0&&year%100!=0)||(year%400==0)){
		 monthday=29;
		}
		if(!(year%4==0&&year%100!=0)||(year%400==0)){
		 monthday=28;
		}
		}
		
		var monthdaybefore=30;//该月上一个月的天数
		var monthbefore;//上一个月的月份
		var yearbefore=year;//上一个月的年份默认是选择的年份
		if(month!=1){//如果选择的不是1月
			monthbefore=month-1;//上个月的月份是此月份减1		
if(monthbefore==1||monthbefore==3||monthbefore==5||monthbefore==7||monthbefore==8||monthbefore==10||monthbefore==12){//同理得到上个月的月份有多少天	monthdaybefore=31;
		}
		if(monthbefore==4||monthbefore==6||monthbefore==9||monthbefore==11){
		 monthdaybefore=30;
		}
		if(monthbefore==2){
		if((year%4==0&&year%100!=0)||(year%400==0)){
		 monthdaybefore=29;
		}
		if(!(year%4==0&&year%100!=0)||(year%400==0)){
		 monthdaybefore=28;
		}
		}
		}else{//如果选择的月是1月
		monthbefore=12;//则上一个月是12月
		yearbefore=year-1;//上一月的年份是选择的年份减1
if(monthbefore==1||monthbefore==3||monthbefore==5||monthbefore==7||monthbefore==8||monthbefore==10||monthbefore==12){//每月多少天
		 monthdaybefore=31;
		}
		if(monthbefore==4||monthbefore==6||monthbefore==9||monthbefore==11){
		 monthdaybefore=30;
		}
		if(monthbefore==2){
		if(((yearbefore-1)%4==0&&(yearbefore-1)%100!= 0)||((yearbefore-1)%400==0)){//闰年用上一个月的年份做判断
		 monthdaybefore=29;
		}
		if(!((yearbefore-1)%4==0&&(yearbefore-1)%100!=0)||((yearbefore-1)%400==0)){
		 monthdaybefore=28;
		}
		}
		}
		//alert(monthday)
		//有了此月及上个月的天数年份,及第一天是周几,就可以分情况得到此月的工作周了
		if(weeknumber==1){//第一天是周一那选择列表就是1号到5号,8号到13号。。。。i做为日期起的基数,j做为日期止的基数
			for(i=1,j=(i+4);i<=monthday&&j<=monthday;i=i+7,j=i+4){//j每次比i大4,i每次循环加一周加7
			$("#cworkday").append("<option  value='o' >"+year+"-"+month+"-"+i+"~"+year+"-"+month+"-"+j+"</option>");
			}//输出格式可以自己改
		}
		if(weeknumber==2){//第一天是周二则第一周的周一包含了上个月的日期。先输出第一个工作周		
			$("#cworkday").append("<option  value='o' >" +yearbefore+"-"+monthbefore+"-"+monthdaybefore+"~"+year+"-"+month+"-4"+"</option>");			
			for(i=7,j=(i+4);i<=monthday&&j<=monthday;i=i+7,j=i+4){//相应第二周的周一为7号(手算为7号)再去循环
			$("#cworkday").append("<option  value='o' >"+year+"-"+month+"-"+i+"~" +year+"-"+month+"-"+j+"</option>");
			}			
		}
		if(weeknumber==3){//第一天是周三 同理		
			$("#cworkday").append("<option  value='o' >"+yearbefore+"-"+monthbefore+"-"+(monthdaybefore-1)+"~"+year+"-"+month+"-3"+"</option>");			
			for(i=6,j=(i+4);i<=monthday&&j<=monthday;i=i+7,j=i+4){
			$("#cworkday").append("<option  value='o' >"+year+"-"+month+"-"+i+"~" +year+"-"+month+"-"+j+"</option>");
			}			
		}
		if(weeknumber==4){//第一天是周四			
			$("#cworkday").append("<option  value='o' >"+yearbefore+"-"+monthbefore+"-"+(monthdaybefore-2)+"~"+year+"-"+month+"-2"+"</option>");			
			for(i=5,j=(i+4);i<=monthday&&j<=monthday;i=i+7,j=i+4){
			$("#cworkday").append("<option  value='o' >"+year+"-"+month+"-"+i+"~"+year+"-"+month+"-"+j+"</option>");
			}			
		}
		if(weeknumber==5){//第一天是周五			
			$("#cworkday").append("<option  value='o' >"+yearbefore+"-"+monthbefore+"-"+(monthdaybefore-3)+"~"+year+"-"+month+"-1"+"</option>");			
			for(i=4,j=(i+4);i<=monthday&&j<=monthday;i=i+7,j=i+4){
			$("#cworkday").append("<option  value='o' >" +year+"-"+month+"-"+i+"~" +year+"-"+month+"-"+j+"</option>");
			}			
		}
		if(weeknumber==6){//第一天是周六		
			for(i=3,j=(i+4);i<=monthday&&j<=monthday;i=i+7,j=i+4){
			$("#cworkday").append("<option  value='o' >" +year+"-"+month+"-"+i+"~" +year+"-"+month+"-"+j+"</option>");
			}			
		}
		if(weeknumber==0){//第一天是周日		
			for(i=2,j=(i+4);i<=monthday&&j<=monthday;i=i+7,j=i+4){
			$("#cworkday").append("<option  value='o' >" +year+"-"+month+"-"+i+"~" +year+"-"+month+"-"+j+"</option>");
			}			
		}
		
	}


最终效果如图

Java学习交流群: 2177712

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics