由于是在网络上无意间找到的一个例程,所以不知道原作者,在此还请原作者见谅!
完整源代码如下:
<!--
var bmoveable=true;
var strframe;
document.writeln('');
strframe='';
strframe+='input.button{border-right: #63a3e9 1px solid;border-top: #63a3e9 1px solid;border-left: #63a3e9 1px solid;';
strframe+='border-bottom: #63a3e9 1px solid;background-color: #63a3e9;font-family:宋体;}';
strframe+='td{font-size: 9pt;font-family:宋体;}';
strframe+='';
strframe+='';
strframe+='var datelayerx,datelayery;';
strframe+='var bdrag;';
strframe+='function document.onmousemove()';
strframe+='{if(bdrag && window.event.button==1)';
strframe+=' {var datelayer=parent.document.all.enddatelayer.style;';
strframe+=' datelayer.posleft += window.event.clientx-datelayerx;';
strframe+=' datelayer.postop += window.event.clienty-datelayery;}}';
strframe+='function dragstart()';
strframe+='{var datelayer=parent.document.all.enddatelayer.style;';
strframe+=' datelayerx=window.event.clientx;';
strframe+=' datelayery=window.event.clienty;';
strframe+=' bdrag=true;}';
strframe+='function dragend(){';
strframe+=' bdrag=false;}';
strframe+='';
strframe+='';
strframe+='';
strframe+='';
strframe+='';
strframe+='';
strframe+='';
strframe+='
'; strframe+='
|
|||||||
'; strframe+='
|
|||||||
'; strframe+='
|
|||||||
'; strframe+='
|
';
window.frames.enddatelayer.document.writeln(strframe);
window.frames.enddatelayer.document.close(); //解决ie进度条不结束的问题
//==================================================== web 页面显示部分 ======================================================
var outobject;
var outbutton; //点击的按钮
var outdate=""; //存放对象的日期
var busetime=false; //是否使用时间
var odatelayer=window.frames.enddatelayer.document.all; //存放日历对象
var odatelayer=window.enddatelayer.document.all;
//odatelayer.busetimelayer.innertext="no";
bimgswitch();
odatelayer.busetimelayer.innerhtml=bimg;
function setday(tt,obj) //主调函数
{
if (arguments.length > 2){alert("對不起!傳入本控件的參數太多!");return;}
if (arguments.length == 0){alert("對不起!您沒有傳回本控件任何參數");return;}
var dads = document.all.enddatelayer.style;
var th = tt;
var ttop = tt.offsettop; //tt控件的定位点高
var thei = tt.clientheight; //tt控件本身的高
var tleft = tt.offsetleft; //tt控件的定位点宽
var ttyp = tt.type; //tt控件的类型
while (tt = tt.offsetparent){ttop+=tt.offsettop; tleft+=tt.offsetleft;}
dads.top = (ttyp=="image") ? ttop+thei : ttop+thei+6;
dads.left = tleft;
outobject = (arguments.length == 1) ? th : obj;
outbutton = (arguments.length == 1) ? null : th; //设定外部点击的按钮
//根据当前输入框的日期显示日历的年月
var reg = /^(\d+)-(\d{1,2})-(\d{1,2})/; //不含时间
var r = outobject.value.match(reg);
if(r!=null){
r[2]=r[2]-1;
var d=new date(r[1],r[2],r[3]);
if(d.getfullyear()==r[1] && d.getmonth()==r[2] && d.getdate()==r[3])
{
outdate=d;
parent.meizztheyear = r[1];
parent.meizzthemonth = r[2];
parent.meizzthedate = r[3];
}
else
{
outdate="";
}
meizzsetday(r[1],r[2]+1);
}
else
{
outdate="";
meizzsetday(new date().getfullyear(), new date().getmonth() + 1);
}
dads.display = '';
//判断初始化时是否使用时间,非严格验证
//if (outobject.value.length>10)
//{
busetime=true;
bimgswitch();
odatelayer.busetimelayer.innerhtml=bimg;
meizzwritehead(meizztheyear,meizzthemonth);
//}
//else
//{
// busetime=false;
// bimgswitch();
// odatelayer.busetimelayer.innerhtml=bimg;
// meizzwritehead(meizztheyear,meizzthemonth);
//}
try
{
event.returnvalue=false;
}
catch (e)
{
//此处排除错误,错误原因暂未找到。
}
}
var monhead = new array(12); //定义阳历中每个月的最大天数
monhead[0] = 31; monhead[1] = 28; monhead[2] = 31; monhead[3] = 30; monhead[4] = 31; monhead[5] = 30;
monhead[6] = 31; monhead[7] = 31; monhead[8] = 30; monhead[9] = 31; monhead[10] = 30; monhead[11] = 31;
var meizztheyear=new date().getfullyear(); //定义年的变量的初始值
var meizzthemonth=new date().getmonth()+1; //定义月的变量的初始值
var meizzthedate=new date().getdate(); //定义日的变量的初始值
var meizzthehour=new date().gethours(); //定义小时变量的初始值
var meizztheminute=new date().getminutes();//定义分钟变量的初始值
var meizzthesecond=new date().getseconds();//定义秒变量的初始值
var meizzwday=new array(37); //定义写日期的数组
function document.onclick() //任意点击时关闭该控件 //ie6的情况可以由下面的切换焦点处理代替
{
with(window.event)
{
if (srcelement != outobject && srcelement != outbutton)
closelayer();
}
}
function document.onkeyup() //按esc键关闭,切换焦点关闭
{
if (window.event.keycode==27){
if(outobject)outobject.blur();
closelayer();
}
else if(document.activeelement)
{
if(document.activeelement != outobject && document.activeelement != outbutton)
{
closelayer();
}
}
}
function meizzwritehead(yy,mm,ss) //往 head 中写入当前的年与月
{
odatelayer.meizzyearhead.innertext = yy + " 年";
odatelayer.meizzmonthhead.innertext = format(mm) + " 月";
//插入当前小时、分
odatelayer.meizzhourhead.innertext=busetime?(meizzthehour+" 時"):"";
odatelayer.meizzminutehead.innertext=busetime?(meizztheminute+" 分"):"";
odatelayer.meizzsecondhead.innertext=busetime?(meizzthesecond+" 秒"):"";
}
function tmpselectyearinnerhtml(stryear) //年份的下拉框
{
if (stryear.match(/\d/)!=null){alert("年份輸入參數不是數字!");return;}
var m = (stryear) ? stryear : new date().getfullyear();
if (m 9999) {alert("年份值不在 1000 到 9999 之間!");return;}
var n = m - 50;
if (n 9999) n = 9974;
var s = " \r\n";
var selectinnerhtml = s;
for (var i = n; i < n + 101; i++)
{
if (i == m) { selectinnerhtml += "" + i + "年" + "\r\n"; }
else { selectinnerhtml += "" + i + "年" + "\r\n"; }
}
selectinnerhtml += "";
odatelayer.tmpselectyearlayer.style.display="";
odatelayer.tmpselectyearlayer.innerhtml = selectinnerhtml;
odatelayer.tmpselectyear.focus();
}
function tmpselectmonthinnerhtml(strmonth) //月份的下拉框
{
if (strmonth.match(/\d/)!=null){alert("月份輸入參數不是數字!");return;}
var m = (strmonth) ? strmonth : new date().getmonth() + 1;
var s = " \r\n";
var selectinnerhtml = s;
for (var i = 1; i < 13; i++)
{
if (i == m) { selectinnerhtml += ""+i+"月"+"\r\n"; }
else { selectinnerhtml += ""+i+"月"+"\r\n"; }
}
selectinnerhtml += "";
odatelayer.tmpselectmonthlayer.style.display="";
odatelayer.tmpselectmonthlayer.innerhtml = selectinnerhtml;
odatelayer.tmpselectmonth.focus();
}
/***** 增加 小时、分钟 ***/
function tmpselecthourinnerhtml(strhour) //小时的下拉框
{
if (!busetime){return;}
if (strhour.match(/\d/)!=null){alert("小時輸入參數不是數字!");return;}
var m = (strhour) ? strhour : new date().gethours();
var s = "\r\n";
var selectinnerhtml = s;
for (var i = 0; i < 24; i++)
{
if (i == m) { selectinnerhtml += ""+i+"\r\n"; }
else { selectinnerhtml += ""+i+"\r\n"; }
}
selectinnerhtml += "";
odatelayer.tmpselecthourlayer.style.display="";
odatelayer.tmpselecthourlayer.innerhtml = selectinnerhtml;
odatelayer.tmpselecthour.focus();
}
function tmpselectminuteinnerhtml(strminute) //分钟的下拉框
{
if (!busetime){return;}
if (strminute.match(/\d/)!=null){alert("分鐘輸入數字不是數字!");return;}
var m = (strminute) ? strminute : new date().getminutes();
var s = "\r\n";
var selectinnerhtml = s;
for (var i = 0; i < 60; i++)
{
if (i == m) { selectinnerhtml += ""+i+"\r\n"; }
else { selectinnerhtml += ""+i+"\r\n"; }
}
selectinnerhtml += "";
odatelayer.tmpselectminutelayer.style.display="";
odatelayer.tmpselectminutelayer.innerhtml = selectinnerhtml;
odatelayer.tmpselectminute.focus();
}
function tmpselectsecondinnerhtml(strsecond) //秒的下拉框
{
if (!busetime){return;}
if (strsecond.match(/\d/)!=null){alert("秒鐘輸入參數不是數字!");return;}
var m = (strsecond) ? strsecond : new date().getminutes();
var s = "\r\n";
var selectinnerhtml = s;
for (var i = 0; i < 60; i++)
{
if (i == m) { selectinnerhtml += ""+i+"\r\n"; }
else { selectinnerhtml += ""+i+"\r\n"; }
}
selectinnerhtml += "";
odatelayer.tmpselectsecondlayer.style.display="";
odatelayer.tmpselectsecondlayer.innerhtml = selectinnerhtml;
odatelayer.tmpselectsecond.focus();
}
function closelayer() //这个层的关闭
{
var o = document.getelementbyid("enddatelayer");
if (o != null)
{
o.style.display="none";
}
}
function showlayer() //这个层的关闭
{
document.all.enddatelayer.style.display="";
}
function ispinyear(year) //判断是否闰平年
{
if (0==year%4&&((year%100!=0)||(year%400==0))) return true;else return false;
}
function getmonthcount(year,month) //闰年二月为29天
{
var c=monhead[month-1];if((month==2)&&ispinyear(year)) c++;return c;
}
function getdow(day,month,year) //求某天的星期几
{
var dt=new date(year,month-1,day).getday()/7; return dt;
}
function meizzprevy() //往前翻 year
{
if(meizztheyear > 999 && meizztheyear 999 && meizztheyear <10000){meizztheyear++;}
else{alert("年份超出范圍(1000-9999)!");}
meizzsetday(meizztheyear,meizzthemonth);
}
function setnull()
{
outobject.value = '';
closelayer();
}
function meizztoday() //today button
{
parent.meizztheyear = new date().getfullyear();
parent.meizzthemonth = new date().getmonth()+1;
parent.meizzthedate = new date().getdate();
parent.meizzthehour = new date().gethours();
parent.meizztheminute = new date().getminutes();
parent.meizzthesecond = new date().getseconds();
var meizzthesecond = new date().getseconds();
if (meizzthemonth<10 && meizzthemonth.length<2) //格式化成两位数字
{
parent.meizzthemonth="0"+parent.meizzthemonth;
}
if (parent.meizzthedate<10 && parent.meizzthedate.length1){meizzthemonth--}else{meizztheyear--;meizzthemonth=12;}
meizzsetday(meizztheyear,meizzthemonth);
}
function meizznextm() //往后翻月份
{
if(meizzthemonth==12){meizztheyear++;meizzthemonth=1}else{meizzthemonth++}
meizzsetday(meizztheyear,meizzthemonth);
}
// todo: 整理代码
function meizzsetday(yy,mm) //主要的写程序**********
{
meizzwritehead(yy,mm);
//设置当前年月的公共变量为传入值
meizztheyear=yy;
meizzthemonth=mm;
for (var i = 0; i < 37; i++){meizzwday[i]=""}; //将显示框的内容全部清空
var day1 = 1,day2=1,firstday = new date(yy,mm-1,1).getday(); //某月第一天的星期几
for (i=0;i<firstday;i++)meizzwday[i]=getmonthcount(mm==1?yy-1:yy,mm==1?12:mm-1)-firstday+i+1 //上个月的最后几天
for (i = firstday; day1 < getmonthcount(yy,mm)+1; i++) { meizzwday[i]=day1;day1++; }
for (i=firstday+getmonthcount(yy,mm);i<37;i++) { meizzwday[i]=day2;day2++; }
for (i = 0; i < 37; i++)
{
var da = eval("odatelayer.meizzday"+i) //书写新的一个月的日期星期排列
if (meizzwday[i]!="")
{
//初始化边框
da.bordercolorlight="#63a3e9";
da.bordercolordark="#63a3e9";
da.style.color="#1478eb";
if(i<firstday) //上个月的部分
{
da.innerhtml="" + meizzwday[i] + "";
da.title=(mm==1?12:mm-1) +"月" + meizzwday[i] + "日";
da.onclick=function("meizzdayclick(this.innertext,-1)");
if(!outdate)
da.style.backgroundcolor = ((mm==1?yy-1:yy) == new date().getfullyear() &&
(mm==1?12:mm-1) == new date().getmonth()+1 && meizzwday[i] == new date().getdate()) ?
"#5cefa0":"#f5f5f5";
else
{
da.style.backgroundcolor =((mm==1?yy-1:yy)==outdate.getfullyear() && (mm==1?12:mm-1)== outdate.getmonth() + 1 &&
meizzwday[i]==outdate.getdate())? "#84c1ff" :
(((mm==1?yy-1:yy) == new date().getfullyear() && (mm==1?12:mm-1) == new date().getmonth()+1 &&
meizzwday[i] == new date().getdate()) ? "#5cefa0":"#f5f5f5");
//将选中的日期显示为凹下去
if((mm==1?yy-1:yy)==outdate.getfullyear() && (mm==1?12:mm-1)== outdate.getmonth() + 1 &&
meizzwday[i]==outdate.getdate())
{
da.bordercolorlight="#ffffff";
da.bordercolordark="#63a3e9";
}
}
}
else if (i>=firstday+getmonthcount(yy,mm)) //下个月的部分
{
da.innerhtml="" + meizzwday[i] + "";
da.title=(mm==12?1:mm+1) +"月" + meizzwday[i] + "日";
da.onclick=function("meizzdayclick(this.innertext,1)");
if(!outdate)
da.style.backgroundcolor = ((mm==12?yy+1:yy) == new date().getfullyear() &&
(mm==12?1:mm+1) == new date().getmonth()+1 && meizzwday[i] == new date().getdate()) ?
"#5cefa0":"#f5f5f5";
else
{
da.style.backgroundcolor =((mm==12?yy+1:yy)==outdate.getfullyear() && (mm==12?1:mm+1)== outdate.getmonth() + 1 &&
meizzwday[i]==outdate.getdate())? "#84c1ff" :
(((mm==12?yy+1:yy) == new date().getfullyear() && (mm==12?1:mm+1) == new date().getmonth()+1 &&
meizzwday[i] == new date().getdate()) ? "#5cefa0":"#f5f5f5");
//将选中的日期显示为凹下去
if((mm==12?yy+1:yy)==outdate.getfullyear() && (mm==12?1:mm+1)== outdate.getmonth() + 1 &&
meizzwday[i]==outdate.getdate())
{
da.bordercolorlight="#ffffff";
da.bordercolordark="#63a3e9";
}
}
}
else //本月的部分
{
da.innerhtml="" + meizzwday[i] + "";
da.title=mm +"月" + meizzwday[i] + "日";
da.onclick=function("meizzdayclick(this.innertext,0)"); //给td赋予onclick事件的处理
//如果是当前选择的日期,则显示亮蓝色的背景;如果是当前日期,则显示暗黄色背景
if(!outdate)
da.style.backgroundcolor = (yy == new date().getfullyear() && mm == new date().getmonth()+1 && meizzwday[i] == new date().getdate())?
"#5cefa0":"#f5f5f5";
else
{
da.style.backgroundcolor =(yy==outdate.getfullyear() && mm== outdate.getmonth() + 1 && meizzwday[i]==outdate.getdate())?
"#84c1ff":((yy == new date().getfullyear() && mm == new date().getmonth()+1 && meizzwday[i] == new date().getdate())?
"#5cefa0":"#f5f5f5");
//将选中的日期显示为凹下去
if(yy==outdate.getfullyear() && mm== outdate.getmonth() + 1 && meizzwday[i]==outdate.getdate())
{
da.bordercolorlight="#ffffff";
da.bordercolordark="#63a3e9";
}
}
}
da.style.cursor="hand"
}
else { da.innerhtml="";da.style.backgroundcolor="";da.style.cursor="default"; }
}
}
function meizzdayclick(n,ex) //点击显示框选取日期,主输入函数*************
{
parent.meizzthedate=n;
var yy=meizztheyear;
var mm = parseint(meizzthemonth)+ex; //ex表示偏移量,用于选择上个月份和下个月份的日期
var hh=meizzthehour;
var mi=meizztheminute;
var se=meizzthesecond;
//判断月份,并进行对应的处理
if(mm12){
yy++;
mm=mm-12;
}
if (mm < 10) {mm = "0" + mm;}
if (hh<10) {hh="0" + hh;} //时
if (mi<10) {mi="0" + mi;} //分
if (se<10) {se="0" + se;} //秒
if (outobject)
{
if (!n) { //outobject.value="";
return;}
if ( n < 10){n = "0" + n;}
writedateto(yy,mm,n,hh,mi,se);
closelayer();
if (busetime)
{
try
{
outbutton.click();
}
catch (e)
{
setday(outobject);
}
}
}
else {closelayer(); alert("您所要輸出的控件對象并不存在!");}
}
function format(n) //格式化数字为两位字符表示
{
var m=new string();
var tmp=new string(n);
if (n<10 && tmp.length
测试一,onfocus事件调用:测试二,onclick事件调用:
[ctrl+a 全选 注:如需引入外部js需刷新才能执行]