日期:2014-05-16  浏览次数:20401 次

JS 关联日期选择范围的限制



?在日期选择控件上,我一直使用之前项目组长推荐的 My97DatePicker 今天使用了一个它在日期选择上比较好的功能.

?

就是朋友 做酒店订房系统,?想要修改 日期控件 入住日期 和 退房日期的选择范围.

?

?

但是要求选择了入住日期之后, 退房日期范围也要随即变化,在入住日期 X 天之后。

?

My97 可以调用函数的方式来设定 日期选择范围 。

?

?

入住日期<input name="checkin" type="text" id="checkin" class="Wdate"  onfocus="WdatePicker({lang:'en',skin:'whyGreen',minDate:'<%=CDate(dateArr(0))%>',maxDate:'<%=CDate(dateArr(1))%>'})" value="<%=CDate(dateArr(0))%>" />



退房日期<input name="checkout" type="text" id="checkout" class="Wdate"  onfocus="WdatePicker({lang:'en',skin:'whyGreen',minDate:'#F{getChkin()}',maxDate:'<%=DateAdd("d",stayDays,CDate(dateArr(1)))%>'})" value="<%=DateAdd("d",stayDays,CDate(dateArr(0)))%>" />

?

?

这里,我使用一个函数 getChkin() 来计算退房日期。 这样调用的:#F{getChkin()}

?

?

此外,还要考虑到几个 问题:

1. 日期选择, 格式化的 问题 。

?

我参考扩展JS 日期类的代码:

						
							/*
							 * 日期格式化方法
							 */
							Date.prototype.format = function(mask) {   
							  
								var d = this;   
							  
								var zeroize = function (value, length) {   
							  
									if (!length) length = 2;   
							  
									value = String(value);   
							  
									for (var i = 0, zeros = ''; i < (length - value.length); i++) {   
							  
										zeros += '0';   
							  
									}   
							  
									return zeros + value;   
							  
								};     
							  
								return mask.replace(/"[^"]*"|'[^']*'|\b(?:d{1,4}|m{1,4}|yy(?:yy)?|([hHMstT])\1?|[lLZ])\b/g, function($0) {   
							  
									switch($0) {   
							  
										case 'd':   return d.getDate();   
							  
										case 'dd':  return zeroize(d.getDate());   
							  
										case 'ddd': return ['Sun','Mon','Tue','Wed','Thr','Fri','Sat'][d.getDay()];   
							  
										case 'dddd':    return ['Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday'][d.getDay()];   
							  
										case 'M':   return d.getMonth() + 1;   
							  
										case 'MM':  return zeroize(d.getMonth() + 1);   
							  
										case 'MMM': return ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'][d.getMonth()];   
							  
										case 'MMMM':    return ['January','February','March','April','May','June','July','August','September','October','November','December'][d.getMonth()];   
							  
										case 'yy':  return String(d.getFullYear()).substr(2);   
							  
										case 'yyyy':    return d.getFullYear();   
							  
										case 'h':   return d.getHours() % 12 || 12;   
							  
										case 'hh':  return zeroize(d.getHours() % 12 || 12);   
							  
										case 'H':   return d.getHours();   
							  
										case 'HH':  return zeroize(d.getHours());   
							  
										case 'm':   return d.getMinutes();   
							  
										case 'mm':  return zeroize(d.getMinutes());   
							  
										case 's':   return d.getSeconds();   
							  
										case 'ss':  return zeroize(d.getSeconds());   
							  
										case 'l':   return zeroize(d.getMilliseconds(), 3);   
							  
										case 'L':   var m = d.getMilliseconds();   
							  
												if (m > 99) m = Math.round(m / 10);   
							  
												return zeroize(m);   
							  
										case 'tt':  return d.getHours() < 12 ? 'am' : 'pm';   
							  
										case 'TT':  return d.getHours() < 12 ? 'AM' : 'PM';   
							  
										case 'Z':   return d.toUTCString().matc