日期选择器完整源码.docx
《日期选择器完整源码.docx》由会员分享，可在线阅读，更多相关《日期选择器完整源码.docx（10页珍藏版）》请在冰点文库上搜索。
日期选择器完整源码
日期选择器：
效果如上图所示。
可作为JSP语言编写的前台界面。
完整复制便可直接使用！
如上图
Calenar.jsp
完整代码如下！
%@pagelanguage=javacontentType=texthtml;charset=gb2312pageEncoding=gb2312%
html
head
metahttp-equiv=Content-Typecontent=texthtml;charset=gb2312
metaname=Authorcontent=JiangHongbin
title日期选择-BYziyuetitle
scriptlanguage=JavaScripttype=textJavaScript
日期选择
varmonths=newArray（一月,二月,三月,四月,五月,六月,七月,八月,九月,十月,十一月,十二月）;
vardaysInMonth=newArray（31,28,31,30,31,30,31,31,30,31,30,31）;
vardays=newArray（日,一,二,三,四,五,六）;
vartoday;
document.writeln（divid='Calendar'style='positionabsolute;z-index1;visibilityhidden;filterprogidDXImageTransform.Microsoft.Shadow（direction=135,color=#999999,strength=3）'div）;
functiongetDays（month,year）
{
下面的这段代码是判断当前是否是闰年的
if（1==month）
return（（0==year%4）&&（0!
=（year%100）））（0==year%400）2928;
else
returndaysInMonth[month];
}
functiongetToday（）
{
得到今天的年,月,日
this.now=newDate（）;
this.year=this.now.getFullYear（）;
this.month=this.now.getMonth（）;
this.day=this.now.getDate（）;
}
functiongetStringDay（str）
{
得到输入框的年,月,日
varstr=str.split（-）
this.now=newDate（parseFloat（str[0]）,parseFloat（str[1]）-1,parseFloat（str[2]））;
this.year=this.now.getFullYear（）;
this.month=this.now.getMonth（）;
this.day=this.now.getDate（）;
}
functionnewCalendar（）{
varparseYear=parseInt（document.all.Year.options[document.all.Year.selectedIndex].value）;
varnewCal=newDate（parseYear,document.all.Month.selectedIndex,1）;
varday=-1;
varstartDay=newCal.getDay（）;
vardaily=0;
if（（today.year==newCal.getFullYear（））&&（today.month==newCal.getMonth（）））
day=today.day;
vartableCal=document.all.calendar;
varintDaysInMonth=getDays（newCal.getMonth（）,newCal.getFullYear（））;
for（varintWeek=1;intWeektableCal.rows.length;intWeek++）
for（varintDay=0;intDaytableCal.rows[intWeek].cells.length;intDay++）
{
varcell=tableCal.rows[intWeek].cells[intDay];
if（（intDay==startDay）&&（0==daily））
daily=1;
if（day==daily）今天，调用今天的Class
{
cell.style.background='#6699CC';
cell.style.color='#FFFFFF';
cell.style.fontWeight='bold';
}
elseif（intDay==6）周六
cell.style.color='green';
elseif（intDay==0）周日
cell.style.color='red';
if（（daily0）&&（daily=intDaysInMonth））
{
cell.innerText=daily;
daily++;
}
else
cell.innerText=;
}
}
functionGetDate（InputBox）
{
varsDate;
这段代码处理鼠标点击的情况
if（event.srcElement.tagName==TD）
if（event.srcElement.innerText!
=）
{
sDate=document.all.Year.value+-+document.all.Month.value+-+event.srcElement.innerText;
eval（document.all.+InputBox）.value=sDate;
HiddenCalendar（）;
}
}
functionHiddenCalendar（）
{
关闭选择窗口
document.all.Calendar.style.visibility='hidden';
}
functionShowCalendar（InputBox）
{
varx,y,intLoop,intWeeks,intDays;
varDivContent;
varyear,month,day;
varo=eval（document.all.+InputBox）;
varthisyear;真正的今年年份
thisyear=newgetToday（）;
thisyear=thisyear.year;
today=o.value;
if（isDate（today））
today=newgetStringDay（today）;
else
today=newgetToday（）;
显示的位置
x=o.offsetLeft;
y=o.offsetTop;
while（o=o.offsetParent）
{
x+=o.offsetLeft;
y+=o.offsetTop;
}
document.all.Calendar.style.left=x+2;
document.all.Calendar.style.top=y+20;
document.all.Calendar.style.visibility=visible;
下面开始输出日历表格（border-color#9DBAF7）
DivContent=tableborder='0'cellspacing='0'style='border1pxsolid#0066FF;background-color#EDF2FC';
DivContent+=tr;
DivContent+=tdstyle='border-bottom1pxsolid#0066FF;background-color#C7D8FA';
年
DivContent+=selectname='Year'id='Year'onChange='newCalendar（）'style='font-familyVerdana;font-size12px';
for（intLoop=thisyear-35;intLoop（thisyear+2）;intLoop++）
DivContent+=optionvalue=+intLoop++（today.year==intLoopSelected）++intLoop+option;
DivContent+=select;
月
DivContent+=selectname='Month'id='Month'onChange='newCalendar（）'style='font-familyVerdana;font-size12px';
for（intLoop=0;intLoopmonths.length;intLoop++）
DivContent+=optionvalue=+（intLoop+1）++（today.month==intLoopSelected）++months[intLoop]+option;
DivContent+=select;
DivContent+=td;
DivContent+=tdstyle='border-bottom1pxsolid#0066FF;background-color#C7D8FA;font-weightbold;font-familyWingdings2,Wingdings,Webdings;font-size16px;padding-top2px;color#4477FF;cursorhand'align='center'title='关闭'onClick='javascriptHiddenCalendar（）'Std;
DivContent+=tr;
DivContent+=trtdalign='center'colspan='2';
DivContent+=tableid='calendar'border='0'width='100%';
星期
DivContent+=tr;
for（intLoop=0;intLoopdays.length;intLoop++）
DivContent+=tdalign='center'style='font-size12px'+days[intLoop]+td;
DivContent+=tr;
天
for（intWeeks=0;intWeeks6;intWeeks++）
{
DivContent+=tr;
for（intDays=0;intDaysdays.length;intDays++）
DivContent+=tdonClick='GetDate（+InputBox+）'style='cursorhand;border-right1pxsolid#BBBBBB;border-bottom1pxsolid#BBBBBB;color#215DC6;font-familyVerdana;font-size12px'align='center'td;
DivContent+=tr;
}
DivContent+=tabletdtrtable;
document.all.Calendar.innerHTML=DivContent;
newCalendar（）;
}
functionisDate（dateStr）
{
vardatePat=^（d{4}）（-）（d{1,2}）（-）（d{1,2}）$;
varmatchArray=dateStr.match（datePat）;
if（matchArray==null）returnfalse;
varmonth=matchArray[3];
varday=matchArray[5];
varyear=matchArray[1];
if（month1month12）returnfalse;
if（day1day31）returnfalse;
if（（month==4month==6month==9month==11）&&day==31）returnfalse;
if（month==2）
{
varisleap=（year%4==0&&（year%100!
=0year%400==0））;
if（day29（day==29&&!
isleap））returnfalse;
}
returntrue;
}
script
styletype=textcss
!
--
td,input{
font-familyVerdana,Arial,Helvetica,sans-serif;
font-size12px;
}
--
style
head
body
formname=form1method=postaction=
tablewidth=500border=0align=centercellspacing=1bgcolor=#CCCCCC
trbgcolor=#FFFFFF
tdalign=right您的生日：
td
tdinputname=birthdaytype=textid=birthdaytitle=点击选择onClick=javascriptShowCalendar（this.id）size=20
inputtype=buttonname=Submitvalue=选择onClick=javascriptShowCalendar（'birthday'）td
tr
table
form
body
html
升级会员 