弹出日历

作者:admin 日期:2008-11-02

字体大小: 小中大

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
<title>Untitled</title>
</head>
<script language="JavaScript"  type="text/javascript">
    //    written    by Tan Ling    Wee    on 2 Dec 2001
    //    last updated 20 June 2003
    //    email :    fuushikaden@yahoo.com

    //last updated by wangwq@atools.cn
    //change the Chinese to escape code
    //last update by wangwq @atools.cn
    //added Clear func 2004-12-23 14:19:04
    var showCharCh        = 1;                        // 0 - English ; 1 - Chinese (if to use in english or Chinese)
    var    fixedX             = -1;                        // x position (-1 if to appear below control)
    var    fixedY             = -1;                        // y position (-1 if to appear below control)
    var startAt         = 1;                        // 0 - sunday ; 1 - monday
    var showWeekNumber     = 1;                        // 0 - don't show; 1 - show
    var showToday        = 1;                        // 0 - don't show; 1 - show
    var imgDir             = "images/";    // directory for images ... e.g. var imgDir="/img/"

    var gotoString             = unescape("%u8FD4%u56DE%u5F53%u524D%u6708");
    var todayString         = unescape("%u4ECA%u5929%u662F");
    var weekString             = unescape("%u661F%u671F");
    var scrollLeftMessage     = unescape("%u70B9%u51FB%u6309%u94AE%u6EDA%u52A8%u5230%u4E0A%u4E00%u6708%2C%u6309%u4F4F%u9F20%u6807%u4E0D%u52A8%u81EA%u52A8%u5411%u524D%u6EDA%u52A8.");
    var scrollRightMessage     = unescape("%u70B9%u51FB%u6309%u94AE%u6EDA%u52A8%u5230%u4E0B%u4E00%u6708%2C%u6309%u4F4F%u9F20%u6807%u4E0D%u52A8%u81EA%u52A8%u5411%u540E%u6EDA%u52A8.");
    var selectMonthMessage     = unescape("%u9009%u62E9%u6708%u5EA6.");
    var selectYearMessage     = unescape("%u9009%u62E9%u5E74%u5EA6.");
    var selectDateMessage     = unescape("%u9009%u62E9%u65E5%u671F%20%5Bdate%5D%20."); // do not replace [date], it will be replaced by date.
    var closeWindowMessage    = unescape("%u5173%u95ED%u65E5%u671F%u9009%u62E9%u7A97%u53E3");
    var clearToPlaceValueMessage    = unescape("%u6E05%u9664");

    if(showCharCh==0)
    {
        gotoString="Back To Currently Month";
        todayString="Today Is";
        weekString="Week";
        scrollLeftMessage="Click The Button To Move Previous Month,Press To Auto Move.";
        scrollRightMessage="Click The Button To Move Next Month,Press To Auto Move.";
        selectMonthMessage="Select Month";
        selectYearMessage="Select Year";
        selectDateMessage="Select Date [date] .";
        closeWindowMessage="Close Date Selected Window";
        clearToPlaceValueMessage="Clear";
    }

    var    crossobj, crossMonthObj, crossYearObj,
        monthSelected, yearSelected, dateSelected,
        omonthSelected, oyearSelected, odateSelected,
        monthConstructed, yearConstructed,
        intervalID1, intervalID2,
        timeoutID1, timeoutID2,
        ctlToPlaceValue, ctlNow,
        dateFormat, nStartingYear;

    var    bPageLoaded    =false;
    var    ie            =document.all;
    var    dom            =document.getElementById;

    var    ns4            =document.layers;
    var    today         =new Date();
    var    dateNow         = today.getDate();
    var    monthNow     = today.getMonth();
    var    yearNow         = today.getYear();
    var    imgsrc         = new Array("drop1.gif","drop2.gif","left1.gif","left2.gif","right1.gif","right2.gif","clear.gif");
    var    img            = new Array();

    var bShow         = false;

    /* hides <select> and <applet> objects (for IE only) */
    function hideElement( elmID, overDiv )
    {
      if( ie )
      {
        for( i = 0; i < document.all.tags( elmID ).length; i++ )
        {
          obj = document.all.tags( elmID )[i];
          if( !obj || !obj.offsetParent )
          {
            continue;
          }

          // Find the element's offsetTop and offsetLeft relative to the BODY tag.
          objLeft   = obj.offsetLeft;
          objTop    = obj.offsetTop;
          objParent = obj.offsetParent;

          while( objParent.tagName.toUpperCase() != "BODY" )
          {
            objLeft  += objParent.offsetLeft;
            objTop   += objParent.offsetTop;
            objParent = objParent.offsetParent;
          }

          objHeight = obj.offsetHeight;
          objWidth = obj.offsetWidth;

          if(( overDiv.offsetLeft + overDiv.offsetWidth ) <= objLeft );
          else if(( overDiv.offsetTop + overDiv.offsetHeight ) <= objTop );
          else if( overDiv.offsetTop >= ( objTop + objHeight ));
          else if( overDiv.offsetLeft >= ( objLeft + objWidth ));
          else
          {
            obj.style.visibility = "hidden";
          }
        }
      }
    }

    /*
    * unhides <select> and <applet> objects (for IE only)
    */
    function showElement( elmID )
    {
      if( ie )
      {
        for( i = 0; i < document.all.tags( elmID ).length; i++ )
        {
          obj = document.all.tags( elmID )[i];

          if( !obj || !obj.offsetParent )
          {
            continue;
          }

          obj.style.visibility = "";
        }
      }
    }

    function HolidayRec (d, m, y, desc)
    {
        this.d = d;
        this.m = m;
        this.y = y;
        this.desc = desc;
    }

    var HolidaysCounter = 0;
    var Holidays = new Array();

    function addHoliday (d, m, y, desc)
    {
        Holidays[HolidaysCounter++] = new HolidayRec ( d, m, y, desc );
    }

    if (dom)
    {
        for    (i=0;i<imgsrc.length;i++)
        {
            img[i] = new Image;
            img[i].src = imgDir + imgsrc[i];
        }
        document.write ("<div onclick='bShow=true' id='calendar'    style='z-index:+999;position:absolute;visibility:hidden;'><table width="+((showWeekNumber==1)?250:220)+" style='font-family:arial;font-size:11px;border-width:1;border-style:solid;border-color:#a0a0a0;font-family:arial; font-size:11px}' bgcolor='#ffffff'><tr bgcolor='#0000aa'><td><table width='"+((showWeekNumber==1)?248:218)+"'><tr><td style='padding:2px;font-family:arial; font-size:11px;'><font color='#ffffff'><B><span id='caption'></span></B></font></td><td align=right><a href='javascript:clearToPlaceValue()'><IMG SRC='"+imgDir+"clear.gif' WIDTH='15' HEIGHT='13' BORDER='0' ALT='"+clearToPlaceValueMessage+"'></a><a href='javascript:hideCalendar()'><IMG SRC='"+imgDir+"close.gif' WIDTH='15' HEIGHT='13' BORDER='0' ALT='"+closeWindowMessage+"'></a></td></tr></table></td></tr><tr><td style='padding:5px' bgcolor=#ffffff><span id='content'></span></td></tr>");

        if (showToday==1)
        {
            document.write ("<tr bgcolor=#f0f0f0><td style='padding:5px' align=center><span id='lblToday'></span></td></tr>");
        }

        document.write ("</table></div><div id='selectMonth' style='z-index:+999;position:absolute;visibility:hidden;'></div><div id='selectYear' style='z-index:+999;position:absolute;visibility:hidden;'></div>");
    }

    var    monthName =    new    Array(unescape("%u4E00%u6708"),unescape("%u4E8C%u6708"),unescape("%u4E09%u6708"),unescape("%u56DB%u6708"),unescape("%u4E94%u6708"),unescape("%u516D%u6708"),unescape("%u4E03%u6708"),unescape("%u516B%u6708"),unescape("%u4E5D%u6708"),unescape("%u5341%u6708"),unescape("%u5341%u4E00%u6708"),unescape("%u5341%u4E8C%u6708"));

    var    monthName2 = new Array(unescape("%u4E00%u6708"),unescape("%u4E8C%u6708"),unescape("%u4E09%u6708"),unescape("%u56DB%u6708"),unescape("%u4E94%u6708"),unescape("%u516D%u6708"),unescape("%u4E03%u6708"),unescape("%u516B%u6708"),unescape("%u4E5D%u6708"),unescape("%u5341%u6708"),unescape("%u5341%u4E00%u6708"),unescape("%u5341%u4E8C%u6708"));

    if(showCharCh==0)
    {
        monthName =    new    Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec");
        monthName2 = new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec");
    }

    if (startAt==0)
    {
        dayName = new Array    (unescape("%u65E5"),unescape("%u4E00"),unescape("%u4E8C"),unescape("%u4E09"),unescape("%u56DB"),unescape("%u4E94"),unescape("%u516D"));
        if(showCharCh==0)
        {
            dayName = new Array    ("Sun","Mon","Tue","Wed","Thu","Fri","Sat");
        }
    }
    else
    {
        dayName = new Array    (unescape("%u4E00"),unescape("%u4E8C"),unescape("%u4E09"),unescape("%u56DB"),unescape("%u4E94"),unescape("%u516D"),unescape("%u65E5"));
        if(showCharCh==0)
        {
            dayName = new Array    ("Mon","Tue","Wed","Thu","Fri","Sat","Sun");
        }
    }
    var    styleAnchor="text-decoration:none;color:black;";
    var    styleLightBorder="border-style:solid;border-width:1px;border-color:#a0a0a0;";

    function swapImage(srcImg, destImg){
        if (ie)    { document.getElementById(srcImg).setAttribute("src",imgDir + destImg); }
    }

    function init()    {
        if (!ns4)
        {
            if (!ie) { yearNow += 1900    }

            crossobj=(dom)?document.getElementById("calendar").style : ie? document.all.calendar : document.calendar;
            hideCalendar();

            crossMonthObj=(dom)?document.getElementById("selectMonth").style : ie? document.all.selectMonth    : document.selectMonth;

            crossYearObj=(dom)?document.getElementById("selectYear").style : ie? document.all.selectYear : document.selectYear;

            monthConstructed=false;
            yearConstructed=false;

            if (showToday==1)
            {
                if(showCharCh==0)
                {
                    document.getElementById("lblToday").innerHTML =    todayString + " <a onmousemove='window.status=\""+gotoString+"\"' onmouseout='window.status=\"\"' title='"+gotoString+"' style='"+styleAnchor+"' href='javascript:monthSelected=monthNow;yearSelected=yearNow;constructCalendar();'>"+" "+monthName[monthNow].substring(0,3)+" "+dateNow +", "+yearNow+ ", " +dayName[(today.getDay()-startAt==-1)?6:(today.getDay()-startAt)]+ "</a>";
                }else
                {
                    document.getElementById("lblToday").innerHTML =    todayString + " <a onmousemove='window.status=\""+gotoString+"\"' onmouseout='window.status=\"\"' title='"+gotoString+"' style='"+styleAnchor+"' href='javascript:monthSelected=monthNow;yearSelected=yearNow;constructCalendar();'>"+yearNow    +unescape("%u5E74")+monthName[monthNow].substring(0,3)    +dateNow +unescape("%u65E5")+ ", " +unescape("%u661F%u671F")+dayName[(today.getDay()-startAt==-1)?6:(today.getDay()-startAt)]+ "</a>";
                }
            }

            sHTML1="<span id='spanLeft'    style='border-style:solid;border-width:1;border-color:#3366FF;cursor:pointer' onmouseover='swapImage(\"changeLeft\",\"left2.gif\");this.style.borderColor=\"#88AAFF\";window.status=\""+scrollLeftMessage+"\"' onclick='javascript:decMonth()' onmouseout='clearInterval(intervalID1);swapImage(\"changeLeft\",\"left1.gif\");this.style.borderColor=\"#3366FF\";window.status=\"\"' onmousedown='clearTimeout(timeoutID1);timeoutID1=setTimeout(\"StartDecMonth()\",500)'    onmouseup='clearTimeout(timeoutID1);clearInterval(intervalID1)'> <IMG id='changeLeft' SRC='"+imgDir+"left1.gif' width=10 height=11 BORDER=0> </span> ";
            sHTML1+="<span id='spanRight' style='border-style:solid;border-width:1;border-color:#3366FF;cursor:pointer'    onmouseover='swapImage(\"changeRight\",\"right2.gif\");this.style.borderColor=\"#88AAFF\";window.status=\""+scrollRightMessage+"\"' onmouseout='clearInterval(intervalID1);swapImage(\"changeRight\",\"right1.gif\");this.style.borderColor=\"#3366FF\";window.status=\"\"' onclick='incMonth()' onmousedown='clearTimeout(timeoutID1);timeoutID1=setTimeout(\"StartIncMonth()\",500)'    onmouseup='clearTimeout(timeoutID1);clearInterval(intervalID1)'> <IMG id='changeRight' SRC='"+imgDir+"right1.gif'    width=10 height=11 BORDER=0> </span> ";
            sHTML1+="<span id='spanMonth' style='border-style:solid;border-width:1;border-color:#3366FF;cursor:pointer'    onmouseover='swapImage(\"changeMonth\",\"drop2.gif\");this.style.borderColor=\"#88AAFF\";window.status=\""+selectMonthMessage+"\"' onmouseout='swapImage(\"changeMonth\",\"drop1.gif\");this.style.borderColor=\"#3366FF\";window.status=\"\"' onclick='popUpMonth()'></span> ";
            sHTML1+="<span id='spanYear' style='border-style:solid;border-width:1;border-color:#3366FF;cursor:pointer' onmouseover='swapImage(\"changeYear\",\"drop2.gif\");this.style.borderColor=\"#88AAFF\";window.status=\""+selectYearMessage+"\"'    onmouseout='swapImage(\"changeYear\",\"drop1.gif\");this.style.borderColor=\"#3366FF\";window.status=\"\"'    onclick='popUpYear()'></span> ";

            document.getElementById("caption").innerHTML  =    sHTML1;

            bPageLoaded=true
        }
    }

    function hideCalendar()    {
        crossobj.visibility="hidden";
        if (crossMonthObj != null){crossMonthObj.visibility="hidden";}
        if (crossYearObj !=    null){crossYearObj.visibility="hidden";}

        showElement( 'Select' );
        showElement( 'APPLET' );
    }

    function padZero(num) {
        return (num    < 10)? '0' + num : num ;
    }

    function constructDate(d,m,y)
    {
        sTmp = dateFormat;
        sTmp = sTmp.replace    ("dd","<e>");
        sTmp = sTmp.replace    ("d","<d>");
        sTmp = sTmp.replace    ("<e>",padZero(d));
        sTmp = sTmp.replace    ("<d>",d);
        sTmp = sTmp.replace    ("mmmm","<p>");
        sTmp = sTmp.replace    ("mmm","<o>");
        sTmp = sTmp.replace    ("mm","<n>");
        sTmp = sTmp.replace    ("m","<m>");
        sTmp = sTmp.replace    ("<m>",m+1);
        sTmp = sTmp.replace    ("<n>",padZero(m+1));
        sTmp = sTmp.replace    ("<o>",monthName[m]);
        sTmp = sTmp.replace    ("<p>",monthName2[m]);
        sTmp = sTmp.replace    ("yyyy",y);
        return sTmp.replace ("yy",padZero(y%100));
    }

    function closeCalendar() {
        var    sTmp;

        hideCalendar();
        ctlToPlaceValue.value =    constructDate(dateSelected,monthSelected,yearSelected);
    }

    function clearToPlaceValue(){
        hideCalendar();
        ctlToPlaceValue.value="";
    }
    /*** Month Pulldown    ***/

    function StartDecMonth()
    {
        intervalID1=setInterval("decMonth()",80);
    }

    function StartIncMonth()
    {
        intervalID1=setInterval("incMonth()",80);
    }

    function incMonth () {
        monthSelected++;
        if (monthSelected>11) {
            monthSelected=0;
            yearSelected++;
        }
        constructCalendar();
    }

    function decMonth () {
        monthSelected--;
        if (monthSelected<0) {
            monthSelected=11;
            yearSelected--;
        }
        constructCalendar();
    }

    function constructMonth() {
        popDownYear();
        if (!monthConstructed) {
            sHTML =    "";
            for    (i=0; i<12;    i++) {
                sName =    monthName[i];
                if (i==monthSelected){
                    sName =    "<B>" +    sName +    "</B>";
                }
                sHTML += "<tr><td id='m" + i + "' onmouseover='this.style.backgroundColor=\"#FFCC99\"' onmouseout='this.style.backgroundColor=\"\"' style='cursor:pointer' onclick='monthConstructed=false;monthSelected=" + i + ";constructCalendar();popDownMonth();event.cancelBubble=true'> " + sName + " </td></tr>";
            }

            document.getElementById("selectMonth").innerHTML = "<table width=70    style='font-family:arial; font-size:11px; border-width:1; border-style:solid; border-color:#a0a0a0;' bgcolor='#FFFFDD' cellspacing=0 onmouseover='clearTimeout(timeoutID1)'    onmouseout='clearTimeout(timeoutID1);timeoutID1=setTimeout(\"popDownMonth()\",100);event.cancelBubble=true'>" +    sHTML +    "</table>";

            monthConstructed=true;
        }
    }

    function popUpMonth() {
        constructMonth();
        crossMonthObj.visibility = (dom||ie)? "visible"    : "show";
        crossMonthObj.left = parseInt(crossobj.left) + 50;
        crossMonthObj.top =    parseInt(crossobj.top) + 26;

        hideElement( 'Select', document.getElementById("selectMonth") );
        hideElement( 'APPLET', document.getElementById("selectMonth") );
    }

    function popDownMonth()    {
        crossMonthObj.visibility= "hidden";
    }

    /*** Year Pulldown ***/

    function incYear() {
        for    (i=0; i<7; i++){
            newYear    = (i+nStartingYear)+1;
            if (newYear==yearSelected)
            { txtYear =    " <B>"    + newYear +    "</B> " ;}
            else
            { txtYear =    " " + newYear + " " ;}
            document.getElementById("y"+i).innerHTML = txtYear;
        }
        nStartingYear ++;
        bShow=true;
    }

    function decYear() {
        for    (i=0; i<7; i++){
            newYear    = (i+nStartingYear)-1;
            if (newYear==yearSelected)
            { txtYear =    " <B>"    + newYear +    "</B> " ;}
            else
            { txtYear =    " " + newYear + " " ;}
            document.getElementById("y"+i).innerHTML = txtYear;
        }
        nStartingYear --;
        bShow=true;
    }

    function selectYear(nYear) {
        yearSelected=parseInt(nYear+nStartingYear);
        yearConstructed=false;
        constructCalendar();
        popDownYear();
    }

    function constructYear() {
        popDownMonth();
        sHTML =    "";
        if (!yearConstructed) {

            sHTML =    "<tr><td align='center'    onmouseover='this.style.backgroundColor=\"#FFCC99\"' onmouseout='clearInterval(intervalID1);this.style.backgroundColor=\"\"' style='cursor:pointer'    onmousedown='clearInterval(intervalID1);intervalID1=setInterval(\"decYear()\",30)' onmouseup='clearInterval(intervalID1)'>-</td></tr>";

            j =    0;
            nStartingYear =    yearSelected-3;
            for    (i=(yearSelected-3); i<=(yearSelected+3); i++) {
                sName =    i;
                if (i==yearSelected){
                    sName =    "<B>" +    sName +    "</B>";
                }

                sHTML += "<tr><td id='y" + j + "' onmouseover='this.style.backgroundColor=\"#FFCC99\"' onmouseout='this.style.backgroundColor=\"\"' style='cursor:pointer' onclick='selectYear("+j+");event.cancelBubble=true'> " + sName + " </td></tr>";
                j ++;
            }

            sHTML += "<tr><td align='center' onmouseover='this.style.backgroundColor=\"#FFCC99\"' onmouseout='clearInterval(intervalID2);this.style.backgroundColor=\"\"' style='cursor:pointer' onmousedown='clearInterval(intervalID2);intervalID2=setInterval(\"incYear()\",30)'    onmouseup='clearInterval(intervalID2)'>+</td></tr>";

            document.getElementById("selectYear").innerHTML    = "<table width=44 style='font-family:arial; font-size:11px; border-width:1; border-style:solid; border-color:#a0a0a0;'    bgcolor='#FFFFDD' onmouseover='clearTimeout(timeoutID2)' onmouseout='clearTimeout(timeoutID2);timeoutID2=setTimeout(\"popDownYear()\",100)' cellspacing=0>"    + sHTML    + "</table>";

            yearConstructed    = true;
        }
    }

    function popDownYear() {
        clearInterval(intervalID1);
        clearTimeout(timeoutID1);
        clearInterval(intervalID2);
        clearTimeout(timeoutID2);
        crossYearObj.visibility= "hidden";
    }

    function popUpYear() {
        var    leftOffset;

        constructYear();
        crossYearObj.visibility    = (dom||ie)? "visible" : "show";
        leftOffset = parseInt(crossobj.left) + document.getElementById("spanYear").offsetLeft;
        if (ie)
        {
            leftOffset += 6;
        }
        crossYearObj.left =    leftOffset;
        crossYearObj.top = parseInt(crossobj.top) +    26;
    }

    /*** calendar ***/
   function WeekNbr(n) {
      // Algorithm used:
      // From Klaus Tondering's Calendar document (The Authority/Guru)
      // hhtp://www.tondering.dk/claus/calendar.html
      // a = (14-month) / 12
      // y = year + 4800 - a
      // m = month + 12a - 3
      // J = day + (153m + 2) / 5 + 365y + y / 4 - y / 100 + y / 400 - 32045
      // d4 = (J + 31741 - (J mod 7)) mod 146097 mod 36524 mod 1461
      // L = d4 / 1460
      // d1 = ((d4 - L) mod 365) + L
      // WeekNumber = d1 / 7 + 1

      year = n.getFullYear();
      month = n.getMonth() + 1;
      if (startAt == 0) {
         day = n.getDate() + 1;
      }
      else {
         day = n.getDate();
      }

      a = Math.floor((14-month) / 12);
      y = year + 4800 - a;
      m = month + 12 * a - 3;
      b = Math.floor(y/4) - Math.floor(y/100) + Math.floor(y/400);
      J = day + Math.floor((153 * m + 2) / 5) + 365 * y + b - 32045;
      d4 = (((J + 31741 - (J % 7)) % 146097) % 36524) % 1461;
      L = Math.floor(d4 / 1460);
      d1 = ((d4 - L) % 365) + L;
      week = Math.floor(d1/7) + 1;

      return week;
   }

    function constructCalendar () {
        var aNumDays = Array (31,0,31,30,31,30,31,31,30,31,30,31);

        var dateMessage;
        var    startDate =    new    Date (yearSelected,monthSelected,1);
        var endDate;

        if (monthSelected==1)
        {
            endDate    = new Date (yearSelected,monthSelected+1,1);
            endDate    = new Date (endDate    - (24*60*60*1000));
            numDaysInMonth = endDate.getDate();
        }
        else
        {
            numDaysInMonth = aNumDays[monthSelected];
        }

        datePointer    = 0;
        dayPointer = startDate.getDay() - startAt;

        if (dayPointer<0)
        {
            dayPointer = 6;
        }

        sHTML =    "<table     border=0 style='font-family:verdana;font-size:10px;'><tr>";

        if (showWeekNumber==1)
        {
            sHTML += "<td width=27><b>" + weekString + "</b></td><td width=1 rowspan=7 bgcolor='#d0d0d0' style='padding:0px'><img src='"+imgDir+"divider.gif' width=1></td>";
        }

        for    (i=0; i<7; i++)    {
            sHTML += "<td width='27' align='right'><B>"+ dayName[i]+"</B></td>";
        }
        sHTML +="</tr><tr>";

        if (showWeekNumber==1)
        {
            sHTML += "<td align=right>" + WeekNbr(startDate) + " </td>";
        }

        for    ( var i=1; i<=dayPointer;i++ )
        {
            sHTML += "<td> </td>";
        }

        for    ( datePointer=1; datePointer<=numDaysInMonth; datePointer++ )
        {
            dayPointer++;
            sHTML += "<td align=right>";
            sStyle=styleAnchor;
            if ((datePointer==odateSelected) &&    (monthSelected==omonthSelected)    && (yearSelected==oyearSelected))
            { sStyle+=styleLightBorder ;}

            sHint = "";
            for (k=0;k<HolidaysCounter;k++)
            {
                if ((parseInt(Holidays[k].d)==datePointer)&&(parseInt(Holidays[k].m)==(monthSelected+1)))
                {
                    if ((parseInt(Holidays[k].y)==0)||((parseInt(Holidays[k].y)==yearSelected)&&(parseInt(Holidays[k].y)!=0)))
                    {
                        sStyle+="background-color:#FFDDDD;";
                        sHint+=sHint==""?Holidays[k].desc:"\n"+Holidays[k].desc;
                    }
                }
            }

            var regexp= /\"/g;
            sHint=sHint.replace(regexp,""");

            dateMessage = "onmousemove='window.status=\""+selectDateMessage.replace("[date]",constructDate(datePointer,monthSelected,yearSelected))+"\"' onmouseout='window.status=\"\"' ";

            if ((datePointer==dateNow)&&(monthSelected==monthNow)&&(yearSelected==yearNow))
            { sHTML += "<b><a "+dateMessage+" title=\"" + sHint + "\" style='"+sStyle+"' href='javascript:dateSelected="+datePointer+";closeCalendar();'><font color=#ff0000> " + datePointer + "</font> </a></b>";}
            else if    (dayPointer % 7 == (startAt * -1)+1)
            { sHTML += "<a "+dateMessage+" title=\"" + sHint + "\" style='"+sStyle+"' href='javascript:dateSelected="+datePointer + ";closeCalendar();'> <font color=#909090>" + datePointer + "</font> </a>"; }
            else
            { sHTML += "<a "+dateMessage+" title=\"" + sHint + "\" style='"+sStyle+"' href='javascript:dateSelected="+datePointer + ";closeCalendar();'> " + datePointer + " </a>"; }

            sHTML += "";
            if ((dayPointer+startAt) % 7 == startAt) {
                sHTML += "</tr><tr>" ;
                if ((showWeekNumber==1)&&(datePointer<numDaysInMonth))
                {
                    sHTML += "<td align=right>" + (WeekNbr(new Date(yearSelected,monthSelected,datePointer+1))) + " </td>";
                }
            }
        }
     try
     {
        document.getElementById("content").innerHTML   = sHTML;
        document.getElementById("spanMonth").innerHTML = " " +    monthName[monthSelected] + " <IMG id='changeMonth' SRC='"+imgDir+"drop1.gif' WIDTH='12' HEIGHT='10' BORDER=0>";
        document.getElementById("spanYear").innerHTML =    " " + yearSelected    + " <IMG id='changeYear' SRC='"+imgDir+"drop1.gif' WIDTH='12' HEIGHT='10' BORDER=0>";
        }
        catch(e)
        {
        }
    }

    /*
    *@format default:yyyy-mm-dd
    *can use:yyyy-m-d,d-m-yyyy,dd-mm-yyyy,mm-dd-yyyy,m-d-yyy...
    *        :yyyy.mm.dd...
    *        :yyyy/mm/dd...
    *        :yyyy mm dd...
    *        :custom
    *@ctl2:ToPlaceValue control
    *@ct1:the calendar appear below control
    */
    function show_calendar(ctl2,ctl,format) {
        var    leftpos=0
        var    toppos=0

        ctl=ctl||ctl2
        format=format||"yyyy-mm-dd"

        if (bPageLoaded)
        {
            if ( crossobj.visibility ==    "hidden" ) {
                ctlToPlaceValue    = ctl2
                dateFormat=format;

                formatChar = " "
                aFormat    = dateFormat.split(formatChar)
                if (aFormat.length<3)
                {
                    formatChar = "/"
                    aFormat    = dateFormat.split(formatChar)
                    if (aFormat.length<3)
                    {
                        formatChar = "."
                        aFormat    = dateFormat.split(formatChar)
                        if (aFormat.length<3)
                        {
                            formatChar = "-"
                            aFormat    = dateFormat.split(formatChar)
                            if (aFormat.length<3)
                            {
                                // invalid date    format
                                formatChar=""
                            }
                        }
                    }
                }

                tokensChanged =    0
                if ( formatChar    != "" )
                {
                    // use user's date
                    aData =    ctl2.value.split(formatChar)

                    for    (i=0;i<3;i++)
                    {
                        if ((aFormat[i]=="d") || (aFormat[i]=="dd"))
                        {
                            dateSelected = parseInt(aData[i], 10)
                            tokensChanged ++
                        }
                        else if    ((aFormat[i]=="m") || (aFormat[i]=="mm"))
                        {
                            monthSelected =    parseInt(aData[i], 10) - 1
                            tokensChanged ++
                        }
                        else if    (aFormat[i]=="yyyy")
                        {
                            yearSelected = parseInt(aData[i], 10)
                            tokensChanged ++
                        }
                        else if    (aFormat[i]=="mmm")
                        {
                            for    (j=0; j<12;    j++)
                            {
                                if (aData[i]==monthName[j])
                                {
                                    monthSelected=j
                                    tokensChanged ++
                                }
                            }
                        }
                        else if    (aFormat[i]=="mmmm")
                        {
                            for    (j=0; j<12;    j++)
                            {
                                if (aData[i]==monthName2[j])
                                {
                                    monthSelected=j
                                    tokensChanged ++
                                }
                            }
                        }
                    }
                }

                if ((tokensChanged!=3)||isNaN(dateSelected)||isNaN(monthSelected)||isNaN(yearSelected))
                {
                    dateSelected = dateNow
                    monthSelected =    monthNow
                    yearSelected = yearNow
                }

                odateSelected=dateSelected
                omonthSelected=monthSelected
                oyearSelected=yearSelected

                aTag = ctl
                do {
                    aTag = aTag.offsetParent;
                    leftpos    += aTag.offsetLeft;
                    toppos += aTag.offsetTop;
                } while(aTag.tagName!="BODY");

                crossobj.left =    fixedX==-1 ? ctl.offsetLeft    + leftpos :    fixedX
                crossobj.top = fixedY==-1 ?    ctl.offsetTop +    toppos + ctl.offsetHeight +    2 :    fixedY
                constructCalendar (1, monthSelected, yearSelected);
                crossobj.visibility=(dom||ie)? "visible" : "show"

                hideElement( 'Select', document.getElementById("calendar") );
                hideElement( 'APPLET', document.getElementById("calendar") );

                bShow = true;
            }
            else
            {
                hideCalendar()
                if (ctlNow!=ctl) {show_calendar(ctl2,ctl,format)}
            }
            ctlNow = ctl
        }
    }

    //hidden the select window by "ESC"
    document.onkeypress = function hidecal1 () {
        if (event.keyCode==27)
        {
            hideCalendar()
        }
    }

    //hidden the select window by click out this
    document.onclick = function hidecal2 () {
        if (!bShow)
        {
            hideCalendar()
        }
        bShow = false
    }

    init()

</script>
<body>
<input onclick="show_calendar(this)">
</body>
</html>

'引用自http://www.52515.net:8088/file.asp?fileid=313231302672713d323030372d332d323326626f61726469643d3431