急救！eLong网首页上的日历是怎么实现的？

canlender.html(elong)
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<style type="text/css">
<!--
.pop{ FONT-FAMILY: 宋体, "Arial";FONT-SIZE: 9pt;color="#000000"}
.hdr {BORDER-RIGHT: black 0px solid;BORDER-TOP: black 0px solid;BACKGROUND: #016E89;BORDER-LEFT: black 0px solid;COLOR: #000000;
BORDER-BOTTOM: black 0px solid}
.hdrA {BORDER-RIGHT: black 0px solid;BORDER-TOP: black 0px solid;BACKGROUND: #016E89;BORDER-LEFT: black 0px solid;CURSOR: hand;COLOR: 
#ffffff;BORDER-BOTTOM: black 0px solid}
.ndt {WIDTH: 19px;POSITION: absolute;HEIGHT: 19px}
.bdt {WIDTH: 19px;POSITION: absolute;HEIGHT: 19px}
.dt {WIDTH: 19px;CURSOR: hand;POSITION: absolute;HEIGHT: 19px}
.sdt {WIDTH: 19px;POSITION: absolute;HEIGHT: 19px}
-->
</style>
</head>
<body text="#000000" vLink="#990000" aLink="#990000" link="#990000" bgColor="#ffffff">
<basefont face="Arial,Helvetica,Geneva,Swiss,Sans Serif">
<table style="BACKGROUND: white;BORDER-BOTTOM: black solid 2px;BORDER-LEFT: black solid 2px;BORDER-RIGHT: black solid 2px;BORDER-TOP: black solid 2px;FONT: 8pt arial" cellSpacing="0" cellPadding="0" border="0">
<tr><td height="20">
<table style="FONT: 8pt arial" height="20" cellSpacing="0" cellPadding="0" border="0">
<tr><td class="hdrA" id="PrevDiv" width="16">
<img id="Prev" onclick="PC();" alt="Show Previous Month" src="http://card.elong.com/images/elements/calendar/prev.gif" width="20" height="21" ></td>
<td class="hdr" align="middle" width="104"><span id="YearTitle"></span>&nbsp;.&nbsp;<span id="MonthTitle"></span></td>
<td class="hdrA" id="NextDiv" width="16">
<img id="Next" onclick="NC();" alt="Show Next Month" src="http://card.elong.com/images/elements/calendar/next.gif" width="20" height="21" ></td></tr>
</table></td></tr>
<tr><td>
<table cellSpacing="0" cellPadding="0" border="0">
<tr><td>
<img id="WeekImg" src="http://card.elong.com/images/elements/calendar/week0.gif" WIDTH="141" HEIGHT="20"></td></tr>
<tr><td style="POSITION: relative" align="middle">
<img class="sdt" id="SelDate" style="DISPLAY: none" src="http://card.elong.com/images/elements/calendar/seldate.gif" WIDTH="19" HEIGHT="19">
<img id="MonthImg" style="LEFT: 0px;POSITION: relative;TOP: 0px" src="http://card.elong.com/images/elements/calendar/blank.gif" width="142" height="121">
<div id="BKIMG1">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
<img src="http://card.elong.com/images/elements/calendar/date.gif" WIDTH="19" HEIGHT="19">
</div>
<img class="ndt" id="Today" style="DISPLAY: none" onclick="TC()" src="http://card.elong.com/images/elements/calendar/ring.gif" WIDTH="19" HEIGHT="19"></td></tr>
</table></td></tr>
<tr><td align="right" height="20"><a href="javascript:CC()" class="pop">关闭窗口</a></td></tr></table>
<script>
<!--
var g_fCalLoaded=false;
var da=document.all;
var wp=window.parent;
var cf=wp.document.all.CalFrame;
var bdc=da.BKIMG1.children;
var dMin;var dMax;
var XOff=2;var YOff=1;
var XSize=20;var YSize=20;
var g_dC=-1;var g_mC=-1;var g_yC=-1;
var g_dI=-1;var g_mI=-1;var g_yI=-1;
        
function DoLoad()        
{        
for(i=0;i<7;i++)        
{        
for(j=0;j<6;j++)        
{        
var t=j*7+i;
bdc[t].day=t+1;
bdc[t].onclick=BC;
bdc[t].className="dt";
bdc[t].style.left=da.MonthImg.offsetLeft+XOff+XSize*i-1;
bdc[t].style.top=da.MonthImg.offsetTop+YOff+YSize*j;
}        
}        
}        
        
function TC()        
{        
if(event.srcElement.className=="dt")        
{        
var dt=new Date();
wp.SetDate(dt.getDate(),dt.getMonth()+1,dt.getFullYear());
cf.style.display="none";
}        
event.cancelBubble = true;
}        
        
function BC()        
{        
if(event.srcElement.className=="dt")        
{        
var iDay = event.srcElement.day;
iDay-=GetDOW(1,g_mC,g_yC);
wp.SetDate(iDay,g_mC,g_yC);
cf.style.display="none";
}        
event.cancelBubble=true;
}        
        
function CC() {cf.style.display="none";}        
        

解决方案 »

  1.   

    function NC()        
    {        
    if(g_mC==12) SetDate(g_dC,1,g_yC+1);
    else SetDate(g_dC,g_mC+1,g_yC);
    }        
            
    function PC()        
    {        
    if(g_mC==1) SetDate(g_dC,12,g_yC-1);
    else SetDate(g_dC,g_mC-1,g_yC);
    }        
            
    function SetInputDate(day,month,year) {g_dI = day;g_mI = month;g_yI = year;}        
            
    function FmtTitle(str)        
    {        
    var r=str.charAt(0);
    for(i=1;i<str.length;i++) r=r+"&nbsp;"+str.charAt(i);
    return r;         
    }        
            
    function SetMinMax(min,max) {dMin=min;dMax=max;}        
            
    function SetDate(day, month, year)        
    {        
    da.WeekImg.src="http://card.elong.com/images/elements/calendar/week"+wp.GetDowStart()+".gif";
    da.MonthImg.src="http://card.elong.com/images/elements/calendar/w"+GetDOW(1,month,year)+"d"+GetMonthCount(month,year)+".gif";
    da.MonthTitle.innerHTML=FmtTitle(rgMN[month-1]);
    da.YearTitle.innerHTML=FmtTitle(year.toString());
    var dt=new Date();
    var s,n,v,d;
            
    d="none";
    if(month==dt.getMonth()+1&&year==dt.getFullYear())        
    {        
    iBox=dt.getDate()+GetDOW(1,dt.getMonth()+1,dt.getFullYear())-1;
    if(ValidDate(dt.getDate(),dt.getMonth()+1,dt.getFullYear())) n="dt";
    else n="bdt";
    da.Today.className=n;
            
    da.Today.style.left=bdc[iBox].style.left;
    da.Today.style.top=bdc[iBox].style.top;
    d="block";
    }        
    da.Today.style.display=d;
            
    d="none";
    if(-1!=g_dI&&month==g_mI&&year==g_yI)        
    {        
    iBox=g_dI+GetDOW(1,g_mI,g_yI)-1;
    da.SelDate.style.left=bdc[iBox].style.left;
    da.SelDate.style.top=bdc[iBox].style.top;
    d="block";
    }        
    da.SelDate.style.display=d;
            
    if( year<dMin.getFullYear() || (year==dMin.getFullYear()&&month<=(dMin.getMonth()+1)) ) {n="hdr";v="hidden";}        
    else {n="hdrA";v="visible";}        
    da.PrevDiv.className=n;
    da.Prev.style.visibility=v;
            
    if( year>dMax.getFullYear() || (year==dMax.getFullYear()&&month>=(dMax.getMonth()+1)) ) {n="hdr";v="hidden";}        
    else {n="hdrA";v="visible";}        
    da.NextDiv.className=n;
    da.Next.style.visibility=v;
            
    var i=0;
    var iMin=GetDOW(1,month,year);
    var iMax=GetMonthCount(month,year)+GetDOW(1,month,year);
            
    for(;i<iMin;i++) {bdc[i].src="http://card.elong.com/images/elements/calendar/nodate.gif";bdc[i].className="ndt";}        
    if( year<dMin.getFullYear() || (year==dMin.getFullYear()&&month<(dMin.getMonth()+1)) || year>dMax.getFullYear() || (year==dMax.getFullYear()&&month>(dMax.getMonth()+1)) )        
    {        
    for(;i<iMax;i++) {bdc[i].src="http://card.elong.com/images/elements/calendar/baddate.gif";bdc[i].className="bdt";}        
    }        
    else if(month==(dMin.getMonth()+1))        
    {        
    iBox=dMin.getDate()+GetDOW(1,dMin.getMonth()+1,dMin.getFullYear())-1;
    for(;i<iMax;i++)        
    {        
    if(i<iBox) {s="http://card.elong.com/images/elements/calendar/baddate.gif";n="bdt";}        
    else {s="http://card.elong.com/images/elements/calendar/date.gif";n="dt";}        
    bdc[i].src=s;bdc[i].className=n;
    }        
    }        
    else if(month==(dMax.getMonth()+1))        
    {        
    iBox=dMax.getDate()+GetDOW(1,dMax.getMonth()+1,dMax.getFullYear())-1;
    for(;i<iMax;i++)        
    {        
    if(i<iBox+1) {s="http://card.elong.com/images/elements/calendar/date.gif";n="dt";}        
    else {s="http://card.elong.com/images/elements/calendar/baddate.gif";n="bdt";}        
    bdc[i].src=s;bdc[i].className=n;
    }        
    }        
    else        
    {        
    for(;i<iMax;i++) {bdc[i].src="http://card.elong.com/images/elements/calendar/date.gif";bdc[i].className="dt";}        
    }        
    for(;i<42;i++) {bdc[i].src="http://card.elong.com/images/elements/calendar/nodate.gif";bdc[i].className="ndt";}        
            
    g_dC=day;
    g_mC=month;
    g_yC=year;
    }        
            
    function ValidDate(day,month,year)        
    {        
    if( year<dMin.getFullYear() || (year==dMin.getFullYear()&&month<(dMin.getMonth()+1)) || (year==dMin.getFullYear()&&month==(dMin.getMonth()+1)&&day<dMin.getDate()) ) return false;
    else if( year>dMax.getFullYear() || (year==dMax.getFullYear()&&month>(dMax.getMonth()+1)) || (year==dMax.getFullYear()&&month==(dMax.getMonth()+1)&&day>dMax.getDate()) ) return false;
    else return true;
    }        
            
    function GetMonthCount(month,year)        
    {        
    var c=rgMC[month-1];
    if((2==month)&&IsLeapYear(year)) c++;
    return c;
    }        
            
    function IsLeapYear(year) {return( 0==year%4 && ((year%100!=0)||(year%400==0)) );}        
            
    function GetDOW(day,month,year)        
    {        
    var dt=new Date(year,month-1,day);
    return (dt.getDay()+(7-wp.GetDowStart()))%7;
    }        function cityname(citys)
    {
     return true;
    }var rgMN=new Array(12);
    rgMN[0]="1";
    rgMN[1]="2";
    rgMN[2]="3";
    rgMN[3]="4";
    rgMN[4]="5";
    rgMN[5]="6";
    rgMN[6]="7";
    rgMN[7]="8";
    rgMN[8]="9";
    rgMN[9]="10";
    rgMN[10]="11";
    rgMN[11]="12";
            
    var rgMC=new Array(12);
    rgMC[0]=31;
    rgMC[1]=28;
    rgMC[2]=31;
    rgMC[3]=30;
    rgMC[4]=31;
    rgMC[5]=30;
    rgMC[6]=31;
    rgMC[7]=31;
    rgMC[8]=30;
    rgMC[9]=31;
    rgMC[10]=30;
    rgMC[11]=31;
            
    g_fCalLoaded=true;
    DoLoad();
    //-->
    </script>
    </body></html>
    <html></html>
      

  2.   

    date.js(elong)
    <!--
    var g_MINY=1601;var g_MAXY=4500;var g_month=0;var g_day=0;var g_year=0;var g_yLow=1990;
    function GetInputDate(t,f){
      var l=t.length;
      if(0==l)return false;
      var cSp='\0';var sSp1="";var sSp2="";
      for(var i=0;i<t.length;i++){
        var c=t.charAt(i);
    if(c==' '||isdigit(c))continue;
    else if(cSp=='\0'&&(c=='/'||c=='-'||c=='.')){ cSp=c;sSp1=t.substring(i+1,l);}
    else if(c==cSp)sSp2=t.substring(i+1,l);
    else if(c!=cSp)return false;
      }
      if(0==sSp1.length)return false;
      var m;var d;var y;
      if(g_dFmt=="mmddyy"){m=atoi(t);d=atoi(sSp1);}
      else{d=atoi(t);m=atoi(sSp1);}
      if(0!=sSp2.length)y=atoi(sSp2);
      else y=DefYr(m,d);
      if(y<100){
        y=1900+y;
    while(y<g_yLow)y=y+100;}
      if(y<g_MINY||y>g_MAXY||m<1||m>12)return false;
      if(d<1||d>GetMonthCount(m,y))return false;
      g_month=m;g_day=d;g_year=y;
      return true;
    }function DefYr(m,d){
      var dt=new Date();
      var yCur=(dt.getYear()<1000)?1900+dt.getYear():dt.getYear();
      if(m-1<dt.getMonth()||(m-1==dt.getMonth()&&d<dt.getDate()))return 1+yCur;else return yCur;
    }function atoi(s){
      var t=0;
      for(var i=0;i<s.length;i++){
        var c=s.charAt(i);
    if(!isdigit(c))return t;
    else t=t*10+(c-'0');
      }
      return t;
    }function isdigit(c){
      return(c>='0'&&c<='9');
    }function GetMonthCount(m,y){
      var c=rgMC[m-1];
      if((2==m)&&IsLeapYear(y))c++;
      return c;
    }function IsLeapYear(y){
      if(0==y%4&&((y%100!=0)||(y%400==0))) return true;else return false;
    }var rgMC=new Array(12);rgMC[0]=31;rgMC[1]=28;rgMC[2]=31;rgMC[3]=30;rgMC[4]=31;rgMC[5]=30;rgMC[6]=31;rgMC[7]=31;rgMC[8]=30;
      rgMC[9]=31;rgMC[10]=30;rgMC[11]=31;
    var g_eC=null;var g_eCV="";var g_dFmt="mmddyy";var g_fnCB=null;function ShowCalendar(eP,eD,eDP,dmin,dmax,fnCB){
      var dF=document.all.CalFrame;
      var wF=window.frames.CalFrame;
      if(null==wF.g_fCalLoaded||false==wF.g_fCalLoaded){
        alert("Unable to load popup calendar.\r\nPlease reload the page.");
    return;
      }
      dtMin=new Date();
      dtMin.setDate(dtMin.getDate()+dmin);
      dtMax=new Date();
      dtMax.setDate(dtMax.getDate()+dmax);
      wF.SetMinMax(new Date(dtMin),new Date(dtMax));
      g_fnCB=fnCB;
      wF.cityname(fnCB);
      if(eD==g_eC&&"block"==dF.style.display){
        if(g_eCV!=eD.value&&GetInputDate(eD.value,g_dFmt)){
      wF.SetInputDate(g_day,g_month,g_year);
      wF.SetDate(g_day,g_month,g_year);
      g_eCV=eD.value;
        }
        else dF.style.display="none";
        }
      else{
        if(GetInputDate(eD.value,g_dFmt)){
      wF.SetInputDate(g_day,g_month,g_year);
      wF.SetDate(g_day,g_month,g_year);
    }
        else if(null!=eDP&&GetInputDate(eDP.value,g_dFmt)){
        wF.SetInputDate(g_day,g_month,g_year);
        wF.SetDate(g_day,g_month,g_year);
      }
        else{
      var dt=new Date(dtMin);
      wF.SetInputDate(-1,-1,-1);
      wF.SetDate(dt.getDate(),dt.getMonth()+1,dt.getFullYear());
    }
      var eL=0;var eT=0;var p=eP;
      while(p&&p.tagName!="BODY"){
        eT+=p.offsetTop;
    eL+=p.offsetLeft;
    p=p.offsetParent;
      }
      var eH=eP.offsetHeight;
      var dH=dF.style.pixelHeight;
      var sT=document.body.scrollTop;
      dF.style.left=eL;
      if(eT-dH>=sT&&eT+eH+dH>document.body.clientHeight+sT) dF.style.top=eT-dH;
      else dF.style.top=eT+eH;
      if("none"==dF.style.display) dF.style.display="block";g_eC=eD;g_eCV=eD.value;
      }
    }/*function SetDate(d,m,y){
      var ds="/";
      g_eC.focus();
      if(g_dFmt=="mmddyy") g_eC.value=m+ds+d+ds+y;
      else g_eC.value=d+ds+m+ds+y;
      g_eCV=g_eC.value;
      if(null!=g_fnCB&&""!=g_fnCB) eval(g_fnCB);
    }*/
    function SetDate(d,m,y){
      var ds="-";
      g_eC.focus();
      g_eC.value=y+ds+m+ds+d;
      g_eCV=g_eC.value;
      if(null!=g_fnCB&&""!=g_fnCB) eval(g_fnCB);
    }function GetDowStart(){return 0;}function GetDOW2(d,m,y){
      var dt=new Date(y,m-1,d);
      return(dt.getDay()+(7-GetDowStart()))%7;
    }function LoadMonths(n){
      var dt=new Date();
      var m=dt.getMonth()+1;
      var y=dt.getFullYear();
      var rg=new Array(n);
      for(i=0;i<n;i++){
        rg[i]=document.createElement("IMG");
        rg[i].src="/images/elements/calendar/w"+GetDOW2(1,m,y)+"d"+GetMonthCount(m,y)+".gif";
        m++;
    if(12<m){ m=1;y++;}
      }
    }LoadMonths(12);function chkBrowser(){
      this.ver=navigator.appVersion;
      this.dom=document.getElementById?1:0;
      this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom)?1:0;
      this.ie4=(document.all && !this.dom)?1:0;
      this.ns5=(this.dom && parseInt(this.ver) >= 5) ?1:0;
      this.ns4=(document.layers && !this.dom)?1:0;
      this.bVer=(this.ie5 || this.ie4 || this.ns4 || this.ns5);
      return this;
    }bVer=new chkBrowser();
    ns4 = (document.layers)? true:false;
    ie4 = (document.all)? true:false;
    function AttB(f){if(bVer.ie4)f.style.display='block';}
    function AttN(f){if(bVer.ie4)f.style.display='none';}function show(idLayer,idParent){
      cLayer=bVer.dom?document.getElementById(idLayer).style:bVer.ie4?document.all[idLayer].style:bVer.ns4?idParent?document[idParent].document[idLayer]:document[idLayer]:0;
      cLayer.display='block';
      divLinksForm=(ns4)?document.divLinks.document.divLinks:document.divLinks;
      var d=document.Wiz;
      if (idLayer=='car'){
        AttB(d.CKind);AttB(d.Ctime1);AttB(d.Ctime2);d.srch[1].status='true';
      }
      else if (idLayer=='hot'){AttB(d.Hcadt);AttB(d.Hckid);d.srch[0].status='true';}
      else{AttB(d.FcAdu);d.srch[2].status='true';/*if (idParent!='flt' && d.opts[1].checked) hide('dts','flt');*/}
    }function hide(idLayer,idParent){
      cLayer=bVer.dom?document.getElementById(idLayer).style:bVer.ie4?document.all[idLayer].style:bVer.ns4?idParent?document[idParent].document[idLayer]:document[idLayer]:0;
      var d=document.Wiz;
      if(idLayer!='flt') AttN(d.FcAdu);
      AttN(d.Hcadt);
      AttN(d.Hckid);
      AttN(d.CKind);
      AttN(d.Ctime1);
      AttN(d.Ctime2);
      cLayer.display='none'
    }
    //--
      

  3.   

    我的程序如下
    就是现实不出代表日的字
    ============================================
    main.htm<html>
    <head>
    <title>Untitled Document</title>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <SCRIPT src="date.js"></SCRIPT>
    </head><body bgcolor="#FFFFFF" text="#000000">
    <IFRAME id=CalFrame 
    style="DISPLAY: none; Z-INDEX: 100; LEFT: 75px; WIDTH: 148px; POSITION: absolute; TOP: 156px; HEIGHT: 194px" 
    marginWidth=0 marginHeight=0 src="calendar.htm" frameBorder=0 
    noResize scrolling=no> 
    </IFRAME>
    <table width="400" border="0" cellspacing="0" cellpadding="0" align="center">
      <tr>
        <td height="200" align="center"> 
          <form name="calendar" method="post" action="">
            <input type="text" name="start_date">
            <A onclick=event.cancelBubble=true; href="javascript:ShowCalendar(document.calendar.dimg,document.calendar.start_date,null,0,330)">
    <img src="images/canlendar.gif" width="42" height="21" align="absmiddle" border="0" id="dimg"> 
    </a>
          </form>
        </td>
      </tr>
    </table>
    </body>
    </html>
      

  4.   

    ============================================
    calendar.htm<HTML><HEAD>
    <META http-equiv=Content-Type content="text/html; charset=gb2312">
    <STYLE>.pop {
    FONT-SIZE: 9pt; COLOR: #000000; FONT-FAMILY: 宋体, "Arial"
    }
    .hdr {
    BORDER-RIGHT: black 0px solid; BORDER-TOP: black 0px solid; BACKGROUND: #339933; BORDER-LEFT: black 0px solid; COLOR: #000000; BORDER-BOTTOM: black 0px solid
    }
    .hdrA {
    BORDER-RIGHT: black 0px solid; BORDER-TOP: black 0px solid; BACKGROUND: #016e89; BORDER-LEFT: black 0px solid; CURSOR: hand; COLOR: #ffffff; BORDER-BOTTOM: black 0px solid
    }
    .ndt {
    WIDTH: 19px; POSITION: absolute; HEIGHT: 19px
    }
    .bdt {
    WIDTH: 19px; POSITION: absolute; HEIGHT: 19px
    }
    .dt {
    WIDTH: 19px; CURSOR: hand; POSITION: absolute; HEIGHT: 19px
    }
    .sdt {
    WIDTH: 19px; POSITION: absolute; HEIGHT: 19px
    }
    </STYLE><META content="MSHTML 6.00.2600.0" name=GENERATOR></HEAD>
    <BODY text=#000000 vLink=#990000 aLink=#990000 link=#990000 bgColor=#ffffff 
    onload=DoLoad()><BASEFONT face="Arial,Helvetica,Geneva,Swiss,Sans Serif">
    <TABLE 
    style="BORDER-RIGHT: black 2px solid; BORDER-TOP: black 2px solid; BACKGROUND: white; FONT: 8pt arial; BORDER-LEFT: black 2px solid; BORDER-BOTTOM: black 2px solid" 
    cellSpacing=0 cellPadding=0 border=0>
      <TBODY>
      <TR>
        <TD height=20>
          <TABLE style="FONT: 8pt arial" height=20 cellSpacing=0 cellPadding=0 
          border=0>
            <TBODY>
            <TR>
              <TD class=hdrA id=PrevDiv width=16><IMG id=Prev onclick=PC(); 
                height=21 alt="Show Previous Month" src="images/prev.gif" 
                width=20></TD>
              <TD class=hdr align=middle width=104><SPAN 
                id=YearTitle></SPAN>&nbsp;.&nbsp;<SPAN id=MonthTitle></SPAN></TD>
              <TD class=hdrA id=NextDiv width=16><IMG id=Next onclick=NC(); 
                height=21 alt="Show Next Month" src="images/next.gif" 
                width=20></TD></TR></TBODY></TABLE></TD></TR>
      <TR>
        <TD>
          <TABLE cellSpacing=0 cellPadding=0 border=0>
            <TBODY>
            <TR>
              <TD><IMG id=WeekImg height=20 src="images/week0.gif" 
                width=141></TD></TR>
            <TR>
              <TD style="POSITION: relative" align=middle><IMG class=sdt 
                id=SelDate style="DISPLAY: none" height=19 
                src="images/seldate.gif" width=19> <IMG id=MonthImg 
                style="LEFT: 0px; POSITION: relative; TOP: 0px" height=121 
                src="images/blank.gif" width=142> 
                <DIV id=BKIMG1><IMG height=19 src="images/date.gif" 
                width=19><IMG height=19 src="images/date.gif" width=19><IMG 
                height=19 src="images/date.gif" width=19><IMG height=19 
                src="images/date.gif" width=19><IMG height=19 
                src="images/date.gif" width=19><IMG height=19 
                src="images/date.gif" width=19> <IMG height=19 
                src="images/date.gif" width=19><IMG height=19 
                src="images/date.gif" width=19><IMG height=19 
                src="images/date.gif" width=19><IMG height=19 
                src="images/date.gif" width=19><IMG height=19 
                src="images/date.gif" width=19><IMG height=19 
                src="images/date.gif" width=19> <IMG height=19 
                src="images/date.gif" width=19><IMG height=19 
                src="images/date.gif" width=19><IMG height=19 
                src="images/date.gif" width=19><IMG height=19 
                src="images/date.gif" width=19><IMG height=19 
                src="images/date.gif" width=19><IMG height=19 
                src="images/date.gif" width=19> <IMG height=19 
                src="images/date.gif" width=19><IMG height=19 
                src="images/date.gif" width=19><IMG height=19 
                src="images/date.gif" width=19><IMG height=19 
                src="images/date.gif" width=19><IMG height=19 
                src="images/date.gif" width=19><IMG height=19 
                src="images/date.gif" width=19> <IMG height=19 
                src="images/date.gif" width=19><IMG height=19 
                src="images/date.gif" width=19><IMG height=19 
                src="images/date.gif" width=19><IMG height=19 
                src="images/date.gif" width=19><IMG height=19 
                src="images/date.gif" width=19><IMG height=19 
                src="images/date.gif" width=19> <IMG height=19 
                src="images/date.gif" width=19><IMG height=19 
                src="images/date.gif" width=19><IMG height=19 
                src="images/date.gif" width=19><IMG height=19 
                src="images/date.gif" width=19><IMG height=19 
                src="images/date.gif" width=19><IMG height=19 
                src="images/date.gif" width=19> <IMG height=19 
                src="images/date.gif" width=19><IMG height=19 
                src="images/date.gif" width=19><IMG height=19 
                src="images/date.gif" width=19><IMG height=19 
                src="images/date.gif" width=19><IMG height=19 
                src="images/date.gif" width=19><IMG height=19 
                src="images/date.gif" width=19> </DIV><IMG class=ndt 
                id=Today style="DISPLAY: none" onclick=TC() height=19 
                src="images/ring.gif" width=19> </TD></TR></TBODY></TABLE></TD></TR>
      <TR>
        <TD align=right height=20><A class=pop 
      href="javascript:CC()">关闭窗口</A></TD></TR></TBODY></TABLE>
    <SCRIPT>        
    <!--        
    var g_fCalLoaded=false;        
    var da=document.all;        
    var wp=window.parent;        
    var cf=wp.document.all.CalFrame;        
    var bdc=da.BKIMG1.children;        
    var dMin;var dMax;        
    var XOff=2;var YOff=1;        
    var XSize=20;var YSize=20;        
    var g_dC=-1;var g_mC=-1;var g_yC=-1;        
    var g_dI=-1;var g_mI=-1;var g_yI=-1;        
            
    function DoLoad()        
    {        
    for(i=0;i<7;i++)        
    {        
    for(j=0;j<6;j++)        
    {        
    var t=j*7+i;        
    bdc[t].day=t+1;        
    bdc[t].onclick=BC;        
    bdc[t].className="dt";        
    bdc[t].style.left=da.MonthImg.offsetLeft+XOff+XSize*i-1;        
    bdc[t].style.top=da.MonthImg.offsetTop+YOff+YSize*j;        
    }        
    }        
    }        
            
      

  5.   

    function TC()        
    {        
    if(event.srcElement.className=="dt")        
    {        
    var dt=new Date();        
    wp.SetDate(dt.getDate(),dt.getMonth()+1,dt.getFullYear());        
    cf.style.display="none";        
    }        
    event.cancelBubble = true;        
    }        
            
    function BC()        
    {        
    if(event.srcElement.className=="dt")        
    {        
    var iDay = event.srcElement.day;        
    iDay-=GetDOW(1,g_mC,g_yC);        
    wp.SetDate(iDay,g_mC,g_yC);        
    cf.style.display="none";        
    }        
    event.cancelBubble=true;        
    }        
            
    function CC() {cf.style.display="none";}        
            
    function NC()        
    {        
    if(g_mC==12) SetDate(g_dC,1,g_yC+1);        
    else SetDate(g_dC,g_mC+1,g_yC);        
    }        
            
    function PC()        
    {        
    if(g_mC==1) SetDate(g_dC,12,g_yC-1);        
    else SetDate(g_dC,g_mC-1,g_yC);        
    }        
            
    function SetInputDate(day,month,year) {g_dI = day;g_mI = month;g_yI = year;}        
            
    function FmtTitle(str)        
    {        
    var r=str.charAt(0);        
    for(i=1;i<str.length;i++) r=r+"&nbsp;"+str.charAt(i);        
    return r;         
    }        
            
    function SetMinMax(min,max) {dMin=min;dMax=max;}        
            
    function SetDate(day, month, year)        
    {        
    da.WeekImg.src="images/week"+wp.GetDowStart()+".gif";        
    da.MonthImg.src="images/w"+GetDOW(1,month,year)+"d"+GetMonthCount(month,year)+".gif";        
    da.MonthTitle.innerHTML=FmtTitle(rgMN[month-1]);    
    da.YearTitle.innerHTML=FmtTitle(year.toString());    
    var dt=new Date();        
    var s,n,v,d;        
            
    d="none";        
    if(month==dt.getMonth()+1&&year==dt.getFullYear())        
    {        
    iBox=dt.getDate()+GetDOW(1,dt.getMonth()+1,dt.getFullYear())-1;        
    if(ValidDate(dt.getDate(),dt.getMonth()+1,dt.getFullYear())) n="dt";        
    else n="bdt";        
    da.Today.className=n;        
            
    da.Today.style.left=bdc[iBox].style.left;        
    da.Today.style.top=bdc[iBox].style.top;        
    d="block";        
    }        
    da.Today.style.display=d;        
            
    d="none";        
    if(-1!=g_dI&&month==g_mI&&year==g_yI)        
    {        
    iBox=g_dI+GetDOW(1,g_mI,g_yI)-1;        
    da.SelDate.style.left=bdc[iBox].style.left;        
    da.SelDate.style.top=bdc[iBox].style.top;        
    d="block";        
    }        
    da.SelDate.style.display=d;        
            
    if( year<dMin.getFullYear() || (year==dMin.getFullYear()&&month<=(dMin.getMonth()+1)) ) {n="hdr";v="hidden";}        
    else {n="hdrA";v="visible";}        
    da.PrevDiv.className=n;        
    da.Prev.style.visibility=v;        
            
    if( year>dMax.getFullYear() || (year==dMax.getFullYear()&&month>=(dMax.getMonth()+1)) ) {n="hdr";v="hidden";}        
    else {n="hdrA";v="visible";}        
    da.NextDiv.className=n;        
    da.Next.style.visibility=v;        
            
    var i=0;        
    var iMin=GetDOW(1,month,year);        
    var iMax=GetMonthCount(month,year)+GetDOW(1,month,year);        
            
    for(;i<iMin;i++) {bdc[i].src="images/nodate.gif";bdc[i].className="ndt";}        
    if( year<dMin.getFullYear() || (year==dMin.getFullYear()&&month<(dMin.getMonth()+1)) || year>dMax.getFullYear() || (year==dMax.getFullYear()&&month>(dMax.getMonth()+1)) )        
    {        
    for(;i<iMax;i++) {bdc[i].src="images/baddate.gif";bdc[i].className="bdt";}        
    }        
    else if(month==(dMin.getMonth()+1))        
    {        
    iBox=dMin.getDate()+GetDOW(1,dMin.getMonth()+1,dMin.getFullYear())-1;        
    for(;i<iMax;i++)        
    {        
    if(i<iBox) {s="images/baddate.gif";n="bdt";}        
    else {s="images/date.gif";n="dt";}        
    bdc[i].src=s;bdc[i].className=n;        
    }        
    }        
    else if(month==(dMax.getMonth()+1))        
    {        
    iBox=dMax.getDate()+GetDOW(1,dMax.getMonth()+1,dMax.getFullYear())-1;        
    for(;i<iMax;i++)        
    {        
    if(i<iBox+1) {s="images/date.gif";n="dt";}        
    else {s="images/baddate.gif";n="bdt";}        
    bdc[i].src=s;bdc[i].className=n;        
    }        
    }        
    else        
    {        
    for(;i<iMax;i++) {bdc[i].src="images/date.gif";bdc[i].className="dt";}        
    }        
    for(;i<42;i++) {bdc[i].src="images/nodate.gif";bdc[i].className="ndt";}        
            
    g_dC=day;        
    g_mC=month;        
    g_yC=year;        
    }        
            
    function ValidDate(day,month,year)        
    {        
    if( year<dMin.getFullYear() || (year==dMin.getFullYear()&&month<(dMin.getMonth()+1)) || (year==dMin.getFullYear()&&month==(dMin.getMonth()+1)&&day<dMin.getDate()) ) return false;        
    else if( year>dMax.getFullYear() || (year==dMax.getFullYear()&&month>(dMax.getMonth()+1)) || (year==dMax.getFullYear()&&month==(dMax.getMonth()+1)&&day>dMax.getDate()) ) return false;        
    else return true;        
    }        
            
    function GetMonthCount(month,year)        
    {        
    var c=rgMC[month-1];        
    if((2==month)&&IsLeapYear(year)) c++;
    return c;        
    }        
            
    function IsLeapYear(year) {return( 0==year%4 && ((year%100!=0)||(year%400==0)) );}        
            
    function GetDOW(day,month,year)        
    {        
    var dt=new Date(year,month-1,day);
    return (dt.getDay()+(7-wp.GetDowStart()))%7;        
    }        function cityname(citys)
    {
     return true;
    }var rgMN=new Array(12);        
    rgMN[0]="1";        
    rgMN[1]="2";        
    rgMN[2]="3";        
    rgMN[3]="4";        
    rgMN[4]="5";        
    rgMN[5]="6";        
    rgMN[6]="7";        
    rgMN[7]="8";        
    rgMN[8]="9";        
    rgMN[9]="10";        
    rgMN[10]="11";        
    rgMN[11]="12";        
            
    var rgMC=new Array(12);        
    rgMC[0]=31;        
    rgMC[1]=28;        
    rgMC[2]=31;        
    rgMC[3]=30;        
    rgMC[4]=31;        
    rgMC[5]=30;        
    rgMC[6]=31;        
    rgMC[7]=31;        
    rgMC[8]=30;        
    rgMC[9]=31;        
    rgMC[10]=30;        
    rgMC[11]=31;        
            
    g_fCalLoaded=true;        
    //-->        
    </SCRIPT>
    </BODY></HTML>
      

  6.   

    http://www.adr.gov.cn/download/ddd.htm
    http://www.adr.gov.cn/download/ccc.htm
    两个时间输入界面，此外送给大家一个VBS版本的日历
    <table border = 0 cellpadding = 0 cellspacing = 0>
    <tr>
    <td>
    <table border = 0 cellpadding = 0 cellspacing = 0 width = 60 height = 70 style = 'position:absolute ;visibility:hidden' bgcolor = #FFFFE7>
    <tr>
    <td align = center>
    <font style = 'cursor:hand ;color:#FF0000 ;font-family:宋体 ;font-size:14pt ;line-height:120%' >&nbsp;</font>
    </td>
    </tr>
    <tr>
    <td align = center>
    <font style ='cursor:hand ;color:#2000FF ;font-family:宋体 ;font-size:9pt ;line-height:110%'>&nbsp;</font> 
    </td>
    </tr>
    </table> 
    <table border = 0 cellpadding = 0 cellspacing = 0 width = 61 bgcolor = #D6D3CE height = 70> 
    <tr>
    <td valign = top width = 100% height = 100%> 
    <table border = 1 cellpadding = 0 cellspacing = 0 width = 58 bgcolor = #FFFFE7 height = 67> 
    <tr>
    <td align = center width = 100% height = 100%> 
    <font id = C1 style = "font-family:宋体; font-size:7pt; line-height:120%">&nbsp;</font></br>
    <font id = C2 style = "color:#FF0000; font-family:Arial ;font-size:14pt ;line-height:120%">&nbsp;</font></br> 
    <font id = C3 style = "font-family:宋体 ;font-size:9pt ;line-height:120%">&nbsp;</font></br> 
    <font id = C4 style = "color:#100080 ;font-family:宋体; font-size:8pt ;line-height:120%">&nbsp;</font>
    </td>
    </tr>
    </table>
    </td>
    </tr>
    </table>
    </td></tr>
    </table>
    <SCRIPT language=vbs>
    function YM() '年月
    YM = "<font color = #3A6EA5>"
    if Weekday(date) = 0 then YM = "<font color = #C00000>"
    if Weekday(date) = 6 then YM = "<font color = #00C000>"
    YM= YM & Year(date) & "年" & Month(date) & "月</font>"
    end functionfunction DD() '日
    DD= "<font color = #FF0000>"
    if Weekday(date)=0 then DD = "<font color = #C00000>"
    if Weekday(date)=6 then DD = "<font color = #00C000>"
    DD= DD & day(date) & "</font>" 
    end functionfunction HMS() '时分秒
    HMS=Hour(Now) & ":"
    dim mm:mm=Minute(Now)
    dim ss:ss=Second(Now)  
    if mm<10 then HMS=HMS & "0" & mm else HMS=HMS & mm
    if ss<10 then HMS=HMS & "0" & ss else HMS=HMS & ss  
    end functionfunction WW() '星期
    WW= "<font color = #0000DF>"
    Dim w:w=Weekday(date) 
    if w = 0 then WW = "<font color = #C00000>"
    if w = 6 then WW = "<font color = #00C000>"
    WW= WW & WeekDayName(w,true) & "</font>" 
    end functionsub CCC() '刷新时间
    C1.innerHTML = YM()
    C2.innerHTML = DD()
    C3.innerHTML = WW()
    C4.innerHTML = HMS()
    end sub
    CCC
    window.setInterval "CCC", "1000" ,"vbs"
    </SCRIPT>
    个人认为VBS比JS的代码易读，短小，功能方便
    我用JS只为了改别人的垃圾代码，如果自己开发，首选VBS
    JS版本对照：
    <SCRIPT language=javascript>
    <!--
    function Year_Month()
    {
     var now = new Date();
     var yyyy = now.getYear();
     var mmmm = now.getMonth() + 1;
     var cl = '<font color = "#3A6EA5">';
     if ( now.getDay() == 0 )
      cl = '<font color = "#C00000">';
     if ( now.getDay() == 6 )
      cl = '<font color = "#00C000">';
     return( cl + yyyy + '年' + mmmm + '月</font>' );
    }
    function Date_of_Today()
    {
     var now = new Date();
     var cl = '<font color = "#FF0000">';
     if ( now.getDay() == 0 )
      cl = '<font color = "#C00000">';
     if ( now.getDay() == 6 )
      cl = '<font color = "#00C000">';
     return( cl + now.getDate() + '</font>' );
    }
    function CurentTime()
    {
     var now = new Date();
     var hh = now.getHours();
     var mm = now.getMinutes();
     var ss = now.getTime() % 60000;
     ss = ( ss - ( ss % 1000 ) ) / 1000;
     var clock = hh + ':';
     if( mm < 10 )
      clock += '0';
     clock += mm + ':';
     if( ss < 10 )
      clock += '0';
     clock += ss;
     return( clock );
    }
    function Day_of_Today()
    {
     var day = new Array();
     day[0] = "星期日";
     day[1] = "星期一";
     day[2] = "星期二";
     day[3] = "星期三";
     day[4] = "星期四";
     day[5] = "星期五";
     day[6] = "星期六";
     var now = new Date();
     var cl = '<font color = "#0000DF">';
     if ( now.getDay() == 0 )
      cl = '<font color = "#C00000">';
     if ( now.getDay() == 6 )
      cl = '<font color = "#00C000">';
     return( cl +  day[ now.getDay() ] + '</font>' );
    }
    function refreshCalendarClock()
    {
     document.all.calendarClock1.innerHTML = Year_Month();
     document.all.calendarClock2.innerHTML = Date_of_Today();
     document.all.calendarClock3.innerHTML = Day_of_Today();
     document.all.calendarClock4.innerHTML = CurentTime();
    }
    var
     webUrl = webUrl;
     document.write( '<table border = "0" cellpadding = "0" cellspacing = "0"><tr><td>' );
     document.write( '<table id = "CalendarClockFreeCode" border = "0" cellpadding = "0" cellspacing = "0" width = "60" height = "70" style = "position:absolute; visibility:hidden" bgcolor = "#FFFFE7">' );
     document.write( '<tr><td align = "center"><font style = "cursor:hand; color:#FF0000; font-family:宋体; font-size:14pt; line-height:120%"' );
     if( webUrl != 'netflower' )
     {
      document.write( '</td></tr><tr><td align = "center"><font style = "cursor:hand; color:#2000FF; font-family:宋体; font-size:9pt; line-height:110%"' );
     }
     document.write( '</td></tr></table>' );
     document.write( '<table border = "0" cellpadding = "0" cellspacing = "0" width = "61" bgcolor = "#D6D3CE" height = "70">' );
     document.write( '<tr><td valign = "top" width = "100%" height = "100%">' );
     document.write( '<table border = "1" cellpadding = "0" cellspacing = "0" width = "58" bgcolor = "#FFFFE7" height = "67">' );
     document.write( '<tr><td align = "center" width = "100%" height = "100%">' );
     document.write( '<font id = "calendarClock1" style = "font-family:宋体; font-size:7pt; line-height:120%"></font><br/>' );
     document.write( '<font id = "calendarClock2" style = "color:#FF0000; font-family:Arial; font-size:14pt; line-height:120%"></font><br/>' );
     document.write( '<font id = "calendarClock3" style = "font-family:宋体; font-size:9pt; line-height:120%"></font><br/>' );
     document.write( '<font id = "calendarClock4" style = "color:#100080; font-family:宋体; font-size:8pt; line-height:120%"></font>' );
     document.write( '</td></tr></table>' );
     document.write( '</td></tr></table>' );
     document.write( '</td></tr></table>' );
     refreshCalendarClock();
     setInterval( 'refreshCalendarClock()', 1000);
    -->
    </SCRIPT>