漂亮的日期选择器

本程序由（易晓峰)凌空踏烟设计制作,转载请保留版权

联系E-mail:conis@163.net 个人主页：http://www.conis.cn QQ:47015280

http://www.52113.com http://www.UpApex.com ICICC:http://www.ICICC.com

贝斯网络@您的电子商务顾问，贝斯网络为您提供专业的电子商务策划、网站建设顾问，贝斯网络有大量的电子商务文章，随时欢迎您的查阅。访问地址：http://www.UpApex.com

//日期的层

document.writeln('<Div style="width:180;height:100;position:absolute;display:none;left:0;top:0;border:1px solid #C8D6FF;z-index:100;font-size:12px" id=aboutlayer>')

document.writeln ('<Table style="width:100%;background-color:#FFFFFF" cellspacing=0 cellpadding=0 ><tr>')

document.writeln ('<td align="center" style="CURSOR:hand;background-color:#8EABFF;color:#FFFFFF" OnClick="about(0)"><b>关闭</b></br></td></tr><tr><td style="font-size:12px;line-height:18px" OnClick="about(0)">')

document.writeln("<Font Color=#8EABFF><b>Apex Date Selector 1.0</b></Font><br>程序系列：Apex 系列软件<br>")

document.writeln("程序名称：ADS 1.0<br>")

document.writeln("程序性质：免费<br>")

document.writeln ('程序版本：1.0<br>')

document.writeln("程序设计：凌空踏烟（易晓峰)<br>")

document.writeln('作者主页：<a href="http://www.conis.cn" target="_black">http://www.conis.cn</a><br>')

document.writeln ('联系作者：<a href="mailto:conis@163.net" title="给作者发邮件">conis@163.net</a><br>联系QQ：47015280</br>')

document.writeln('软件主页：<a href="http://www.UpApex.com" target="_black">http://www.UpApex.com</a><br>')

document.writeln('下载地址：<a href="http://www.upapex.com/apex2004/product_service.asp.asp" target="_black">点击下载</a><br>')

document.writeln ('</td></tr><tr><td align="center" style="CURSOR:hand;background-color:#8EABFF;color:#FFFFFF" OnClick="about(0)"><b>关闭</b></br>')

document.writeln ('</td></tr></Table></Div>')

document.writeln ('<Div style="width:160;height:140;position:absolute;display:none;left:0;top:0;border:1px solid #C8D6FF;z-index:98;background-color:#FFFFFF" id=showdatelayer valign="top">')

document.writeln ('<Table width=100% height=100% style="font-size:10px" border=0 cellspacing=0 cellpadding=0><tr><td align="center">')

document.writeln ('<Table style="background-color:#8EABFF;color:#FFFFFF" width=100%><tr><td title="减小年" style="CURSOR:hand;font-size:12px" onclick="setdate(0,0)">-Y</td><td style="CURSOR:hand;font-size:12px" title="减小月" onclick="setdate(1,0)">-M</td>')

document.writeln ('<td style="font-size:12px" align="center" id=year></td><td style="font-size:12px" align="center" >年</td><td style="font-size:12px" align="center" id=month></td><td style="font-size:12px" align="center">月</td>')

document.writeln ('<td style="CURSOR:hand;font-size:12px" title="增加年" onclick="setdate(0,1)">+Y</td><td style="CURSOR:hand;font-size:12px" title="增加月" onclick="setdate(1,1)">+M</td></tr></Table>')

document.writeln ('</td></tr><tr><td align="center"><Table width=100% style="border-bottom:1px solid #C8D6FF"><tr style="font-size:12px"><td>日</td><td>一</td><td>二</td><td>三</td><td>四</td><td>五</td><td>六</td></tr></Table>')

document.writeln ('</td><tr><td><Table width=100%>')

//循环出单元格

var n=0

for (i=1;i<=6;i++){

document.writeln ('<tr align="center">')

for (j=1;j<=7;j++){

document.writeln ('<td align="center" style="font-size:12px;CURSOR:hand" OnClick="selectday(this.innerText)" id=day'+n+'></td>')

n++;

}

document.writeln ('</tr>')

}

//结束循环

document.writeln ('</td></tr></table>')

document.writeln ('</td><tr><td style="font-size:12px;display:none;height:25" id=selectcell valign="bottom">')

document.writeln ('<select onchange="selectdate(0,this.value)" style="border:none;">')

document.writeln ('<option value="'+new Date().getYear()+'" selected>'+new Date().getYear()+'</option>')

for (y=new Date().getYear()-10;y<=new Date().getYear()+10;y++){

//此处可以修改选择日期的开始与结束年份

document.writeln ('<option value='+y+'>'+y+'</option>')

}

document.writeln ('</select>年<select onchange="selectdate(1,this.value)">')

document.writeln ('<option value="'+new Date().getMonth()+'" selected>'+(new Date().getMonth()+1)+'</option>')

for (m=1;m<=12;m++){

//此处可以修改选择日期的开始与结束年份

document.writeln ('<option value='+m+'>'+m+'</option>')

}

document.writeln ('<select> 月 <Span style="CURSOR:hand" onclick="opencell(0)" title="关闭时间选择器">关闭</Span>')

document.writeln ('</td></tr></Table></DIv>')

//到此日期层结束

//关闭日期层的层

document.writeln ('<Div id=closedatelayer style="display:none;left:0;top:0;position:absolute;width:110;height:10;z-index:99;font-size:12px"><Span style="CURSOR:hand" onclick="opencell(1)" title="打开时间选择器">选择 </Span><Span style="CURSOR:hand" onclick="closelayer()">关闭窗口 </Span><Span Onclick="about(1)" style="CURSOR:hand" title="关于本程序">关于</Span></Div>')

var Tobject//全局变量，对象

var year//年

var month//月

var thedate//日

var datestyle//日期样式

var lack

function setdate(obj,aspect){//算日期

//obj 0=年，1=ā月 aspect 0=减 1=加

month=document.all.month.innerText//月，表格里的

year=document.all.year.innerText//年

if (month=="") month=new Date().getMonth()+1;//如果时间为空，则为当前年月

if (year=="") year=new Date().getYear();

//=====================================

if (obj==0){//年

if (aspect==0){//减

year=year-1;

}else{

year=year*1+1;

}

}else if (obj==1){

if (aspect==0){

month=month-1;

}else{

month=month*1+1;

}

if (month==13){//大于12月

year=year*1+1;

month=1;

}

if (month==0){//小于1月

year=year-1;

month=12;

}

writedate(year,month)

}

//======================================

function selectdate(selectobject,value){

//selectobject 0为年,1为月

if (selectobject==0){

year=value

writedate(value,month)

}else if (selectobject==1){

month=value

writedate(year,value)

}

//====================================

function writedate(writeyear,writemonth){//写入年与日历

var day

var firstday

if (writemonth==1||writemonth==3||writemonth==5||writemonth==7||writemonth==8||writemonth==10||writemonth==12){

day=31//大月

}else if(writemonth==4||writemonth==6||writemonth==9||writemonth==11){

day=30//小月

}else if (writeyear%4==0&&(writeyear%100!==0||writeyear%500==0)){

day=29

}else{

day=28

}

firstday=new Date(writeyear,writemonth-1,1).getDay();

firstday=0-firstday

//本月第一天是星期几

var u=firstday+1;

for (f=0;f<=41;f++){

var thisday = eval("document.all.day"+f)

//====================================小于1则为空

if (u<1||u>day){

thisday.innerHTML=" ";

thisday.style.cursor="default";

thisday.bgColor="#FFFFFF";

}else{

thisday.innerHTML=u

thisday.bgColor="#E6ECFF";

}

//=====================================

u++;

}

document.all.year.innerHTML=writeyear;//写入年

document.all.month.innerHTML=writemonth;//写入月

var year_month

if (Tobject.value==""){//初始值

year_month=evaldate(writeyear,writemonth,new Date().getDate())

}else{

if (thedate="undefined"){

thedate=new Date().getDate()

Tobject.value=Tobject.value //没有选择日期

}

year_month=evaldate(writeyear,writemonth,thedate)

}

//Tobject.value=year_month;

//计算一个月多少天结束

}

//==============================================

function evaldate(theyear,themonth,theday){//计算日期与样式

//lack (=0 补0;lack=1 不补0;);styledate(=0 -;=1 /;=2 汉字日期;=3 yymmdd )

if (lack==0){//补0

if (themonth<10){themonth="0"+themonth};

if (theday<10) {theday="0"+theday};

}

if (datestyle==0){

return theyear+"-"+themonth+"-"+theday

}else if (datestyle==1){

return theyear+"/"+themonth+"/"+theday

}else if (datestyle==2){

return theyear+"年"+themonth+"月"+theday+"日"

}else{

return theyear+""+themonth+""+theday

}

function selectday(day){//写入年月日

if (day>0&&day<=31){

var year_month_day=evaldate(year,month,day)

thedate=day

//alert (thedate)

Tobject.value=year_month_day

closelayer()

}

function showdate(object,thisdatestyle,thislack){//设定层的位置，写入日期

var style=document.all.showdatelayer.style;

var closestyle=document.all.closedatelayer.style;//关闭层的样式

x=window.event.x;//窗口的X坐标

y=window.event.y;//纵坐标

style.top=y+10;//层距顶部的位置

style.left=x-20;//层距左边的距离

closestyle.top=y+148;

closestyle.left=x+30;//关闭日期层的位置

closestyle.display='block';

style.display='block';

Tobject=object;//全局变量

datestyle=thisdatestyle;//日期样式

lack=thislack;//是否补0

if (Tobject==""){thedate=new Date().getDate()}//初始日期

setdate()//写入日期

//setTimeout("closelayer()",10000);//设定关闭层的时间

}

function closelayer(){

showdatelayer.style.display='none'

closedatelayer.style.display='none'

aboutlayer.style.display='none'

}

function opencell(show_hidden){

if (show_hidden==0){

document.all.selectcell.style.display='none'

}else{

document.all.selectcell.style.display='block'

}

function about(value){

aboutstyle=document.all.aboutlayer.style

if (value==1){

aboutstyle.display="block"

aboutstyle.left=window.event.x-150;

aboutstyle.top=window.event.y-155;

showdatelayer.style.display="none"

}else{

aboutstyle.display="none"

showdatelayer.style.display="block"

}

//End