日历_populate the calendar-CSDN博客

本文链接：https://blog.csdn.net/SurreyWilliam/article/details/2259642

   <div id="DivCalendar" style="display: none; left: 264px; position: absolute; top: 568px">
     <iframe style="Z-INDEX: -1; LEFT: 0px; WIDTH: 170px; POSITION: absolute; TOP: 0px; HEIGHT: 160px"
      src="blank.htm" frameborder="0" scrolling="no"></iframe>
     <table class="calendarBigBorder" id="caltable" cellspacing="1" cellpadding="0" width="200"border="0">
      <thead>
       <tr valign="middle" align="center">
        <td class="calendarMonthTitle" colspan="7"><input class="calendarYInput" οnpaste="this.value=this.value.replace(/[^0-9]/g,'')" οnkeydοwn="if (event.keyCode==13){setDate();}"
          οnkeyup="this.value=this.value.replace(/[^0-9]/g,'')" type="text" maxlength="4" size="3" name="year" />[<a οnclick="subYear()" href="javascript:;"><</a>]年[<a οnclick="addYear()" href="javascript:;">></a>]
         <input class="calendarMInput" οnpaste="this.value=this.value.replace(/[^0-9]/g,'')" οnkeydοwn="if (event.keyCode==13){setDate();}"
          οnkeyup="this.value=this.value.replace(/[^0-9]/g,'')" type="text" maxlength="2" size="1"
          name="month"/>[<a οnclick="subMonth()" href="javascript:;"><<</a>]月[<a οnclick="addMonth()" href="javascript:;">>></a>] 
         <a οnclick="CloseCalendar();" href="javascript:;">[X]</a></td>
       </tr>
       <tr valign="middle" align="center">
        <script language="JavaScript" type="text/javascript">
          document.write("<TD class=calendarDaySun id=diary>" + days[0] + "</TD>");
          for (var intLoop = 1; intLoop < days.length-1;
          intLoop++)
          document.write("<TD class=calendarTd id=diary>" + days[intLoop] + "</TD>");
          document.write("<TD class=calendarDaySat id=diary>" + days[intLoop] + "</TD>");
        </script>
       </tr>
      </thead>
      <tbody οnmοuseup="document.selection.empty()" οncοntextmenu="return false" onselectstart="return false"
       id="calendar" οndragstart="return false" onbeforecopy="return false" οncοpy="document.selection.empty()"
       align="center" οnselect="document.selection.empty()" cellpadding="0" cellspacing="0"border="1">
       <script language="JavaScript" type="text/javascript">
         for (var intWeeks = 0; intWeeks < 6; intWeeks++) {
         document.write("<TR style='cursor:hand'>");
         for (var intDays = 0; intDays < days.length;intDays++)
         document.write("<TD class=calendarTd οnclick='setRevDateBefore()' onMouseover='{classTemp=this.className;this.className=calendarHover}' onMouseOut='this.className=classTemp'></TD>");
         document.write("</TR>");
         }
       </script>
      </tbody>
     </table>
    </div>
    <input id="hdnDateName" type="hidden" name="hdnDateName" />
    <script language="JavaScript" type="text/javascript">
      Calendar();
    </script>

var months = new Array("Jan", "Feb", "Mar","Apr", "May", "Jun", "Jul", "Aug", "Sep","Oct", "Nov", "Dec");
var daysInMonth = new Array(31, 28, 31, 30, 31, 30, 31, 31,30, 31, 30, 31);
var days = new Array("日","一", "二", "三","四", "五", "六");
var classTemp;
var calendarHover="calendarHover";
var today=new getToday();
var year=today.year;
var month=today.month;
var newCal;
var FromDate='';
var ToDate='';

// add on 11/24 (Tom)
var tag='';
/*******************************************************************************
-- Function getDays
-- Description: This will return the num of days in such month
-- Input: month,year
-- Output:the value of the array daysInMonth[monthindex]
-- 10/10/04 - Created (Cooker)
********************************************************************************/
function getDays(month, year)
{ if (month==1)//check whether the year is a leap year or not when the month is Feb.
return ((0 == year % 4) && (0 != (year % 100))) ||(0 == year % 400) ? 29 : 28;
else
return daysInMonth[month];
}

/*******************************************************************************
-- Function getToday
-- Description: This will return what day it is today
-- Input:
-- Output:
-- 10/10/04 - Created (Cooker)
********************************************************************************/
function getToday()
{ this.now = new Date();
   this.year = this.now.getFullYear();
   this.month = this.now.getMonth();
   this.day = this.now.getDate();
}

/*******************************************************************************
-- Function Calendar
-- Description: Show the Calendar
-- Input:
-- Output:
-- 10/10/04 - Created (Cooker)
********************************************************************************/
function Calendar(textday)
{ newCal = new Date(year,month,1);//get the first day of current month
   today = new getToday();
   var day = -1;
   var tday = -1;
   var startDay = newCal.getDay();
   var endDay=getDays(newCal.getMonth(), newCal.getFullYear());
   var daily = 0;
   if ((today.year == newCal.getFullYear()) &&(today.month == newCal.getMonth()))
      day = today.day;

if(textday!=null && typeof(textday)!='undefined' && textday.getYear() == newCal.getFullYear() && textday.getMonth() == newCal.getMonth())
  tday = textday.getDate();

   var caltable = document.all.caltable.tBodies.calendar; //get the collection of the calendar table
   var intDaysInMonth =getDays(newCal.getMonth(), newCal.getFullYear()); //get the num of days in such month
   //create the calendar
   for (var intWeek = 0; intWeek < caltable.rows.length;intWeek++)
     for (var intDay = 0;intDay < caltable.rows[intWeek].cells.length;intDay++)
     {
      var cell = caltable.rows[intWeek].cells[intDay];   //get the cell case

     var montemp=(newCal.getMonth()+1)<10?("0"+(newCal.getMonth()+1)):(newCal.getMonth()+1);
      if ((intDay == startDay) && (0 == daily)){ daily = 1;}
      var daytemp=daily<10?("0"+daily):(daily);
      var d="<"+newCal.getFullYear()+"-"+montemp+"-"+daytemp+">";
   //set style

      if(day==daily)
      cell.className="calendarNow";
      else if(intDay==6)
      cell.className = "calendarDaySat";
      else if (intDay==0)
      cell.className ="calendarDaySun";
      else
      cell.className="calendarTd";

  if (day!=daily && tday==daily)
   cell.className = "calendarText";

      if ((daily > 0) && (daily <= intDaysInMonth))
      { cell.innerText = daily;
         daily++;
      }
      else
        cell.innerText = "";
    }

document.all.year.value=year;
document.all.month.value=month+1<10 ? "0"+(month+1) : month+1;

}

/*******************************************************************************
-- Function subMonth
-- Description: This will return the PreMonth
-- Input:
-- Output:
-- 10/10/04 - Created (Cooker)
********************************************************************************/
function subMonth()
{
if ((month-1)<0)
{
month=11;
year=year-1;
}
else
{
month=month-1;
}
Calendar();
}

/*******************************************************************************
-- Function addMonth
-- Description: This will return next Month
-- Input:
-- Output:
-- 10/10/04 - Created (Cooker)
********************************************************************************/
function addMonth()
{
if((month+1)>11)
{
    month=0;
    year=year+1;
}
else
{
    month=month+1;
}
Calendar();
}
/*******************************************************************************
-- Function subYear
-- Description: This will return last Year
-- Input:
-- Output:
-- 12/17/04 - Created (Nancy)
********************************************************************************/
function subYear()
{
year=year-1;
Calendar();
}
/*******************************************************************************
-- Function addYear
-- Description: This will return next Year
-- Input:
-- Output:
-- 12/17/04 - Created (Nancy)
********************************************************************************/
function addYear()
{
year=year+1;
Calendar();
}

/*******************************************************************************
-- Function setRevDate
-- Description: This will fill the blank revDate the date selected
-- Input:
-- Output:
-- 10/10/04 - Created (Cooker)
-- 11/24/04 - Updated (Tom)
********************************************************************************/
function setRevDate()
{
tag = document.all['hdnDateName'].value;

if(tag!='')
{
  var InputDate=document.getElementById(tag);
  var year=document.getElementById("year").value;
  var month=document.getElementById("month").value;
  var day=event.srcElement.innerText;

    //--2005-/04/07 No action if click blank cell (Nancy)
  if (event.srcElement.innerText.length>0)
  {
   //InputDate.value=' ';
   day=day < 10 ? "0"+day:day;
   if(day!='' && !CompareDate(month+"/"+day+"/"+year,today.month+1+"/"+today.day+"/"+today.year))
   {
    InputDate.value=month+"/"+day+"/"+year;
   }
  }

  CloseCalendar();
}
}

/*******************************************************************************
-- Function setHolidayDate
-- Description: This will fill the blank HolidayDate the date selected
-- Input:
-- Output:
-- 11/02/04 - Created (Cooker)
********************************************************************************/
function setHolidayDate()
{
var InputDate=document.getElementById("txtReq_date");
var year=document.getElementById("year").value;
var month=document.getElementById("month").value;
var day=event.srcElement.innerText;

//InputDate.value=' ';
day=day < 10 ? "0"+day:day;

if(day!='')
{
InputDate.value=month+"/"+day+"/"+year;

}
CloseCalendar();
}

/*******************************************************************************
-- Function setRevDateFromCal()
-- Description: This will fill the blank revDate the date selected,
used when there is more than 1 inputDate
-- Input:
-- Output:
-- 10/29/2004 modified from function setRevDate() Nancy
-- 11/18/2004 modified (Cooker)
********************************************************************************/

function setRevDateFromCal()
{
    //modifiled 11/18/2004
var DateName = document.all.hdnDateName.value
var InputDate=document.getElementById(DateName)
    //var InputDate=document.getElementById(document.all.hdnDateName.value);
    //11/18/2004

//var InputDate=document.getElementById(atag);
var year=document.getElementById("year").value;
var month=document.getElementById("month").value;

//--2005-/04/07 No action if click blank cell (Nancy)
    if (event.srcElement.innerText.length>0){

CloseCalendar();
}
}
/*******************************************************************************
-- Function setRevDateBefore()
-- Description: This will fill the blank revDate the date(before today) selected,
                used when there is more than 1 inputDate
-- Input:
-- Output:
-- 10/29/2004 modified from function setRevDateFromCal()   (wan)
-- 11/18/2004 modified     (Cooker)
********************************************************************************/

function setRevDateBefore()
{
//modifiled 11/18/2004
var DateName = document.all.hdnDateName.value
var InputDate=document.getElementById(DateName)
    //var InputDate=document.getElementById(document.all.hdnDateName.value);
    //11/18/2004
    //var InputDate=document.getElementById(atag);
var year=document.getElementById("year").value;
var month=document.getElementById("month").value;

//--2005-/04/07 No action if click blank cell (Nancy)
if (event.srcElement.innerText.length>0){
var day=event.srcElement.innerText;

//alert(year + month + day)

//InputDate.value=' ';
day=day < 10 ? "0"+day:day;

//if(day!='' && !CompareDate(month+"/"+day+"/"+year,today.month+1+"/"+today.day+"/"+today.year))
//{

//modifiled 11/18/2004
if (DateName=='txtTo' || DateName=="txtDateE")
{
  //add 3/4/05 (wan)
  //alert(FromDate);
  if(typeof(document.all['txtFrom'])!='undefined' && document.all['txtFrom'].value.length>0)
  {
   FromDate = document.all['txtFrom'].value;
  }

  if (FromDate=='')
  {
   //InputDate.value=month+"/"+day+"/"+year;   modify here by william 2008/04/02
   InputDate.value=year+"-"+month+"-"+day;
   ToDate=InputDate.value;
  }
  else
  {
   if(day!='' && !CompareDate(month+"/"+day+"/"+year,FromDate))
   {
    //InputDate.value=month+"/"+day+"/"+year;   modify here by william 2008/04/02
    InputDate.value=year+"-"+month+"-"+day;
    ToDate=InputDate.value;
   }
  }
}
else
{
  //add 3/4/05 (wan)
  if(typeof(document.all['txtTo'])!='undefined' &&
   document.all['txtTo'].value.length>0)
  {
   ToDate = document.all['txtTo'].value;
  }

  if(ToDate!='') //if the todate was filled first
  {
   if(day!='' && !CompareDate(ToDate,month+"/"+day+"/"+year))
   {
    //InputDate.value=month+"/"+day+"/"+year;      modify here by william 2008/04/02
    InputDate.value=year+"-"+month+"-"+day;

    FromDate=InputDate;
   }
  }
  else
   //InputDate.value=month+"/"+day+"/"+year;        modify here by william 2008/04/02
   InputDate.value=year+"-"+month+"-"+day;

   FromDate=InputDate.value;
}
//alert(FromDate + '||' + ToDate);
//11/18/2004
  document.all["DivCalendar"].style.display = 'none';
//}
}
}

/*******************************************************************************
-- Function setDate
-- Description: This will return a new date that filled in the calendar's blanks
-- Input:
-- Output:
-- 10/10/04 - Created (Cooker)
********************************************************************************/
function setDate()
{
if (document.all.month.value<1||document.all.month.value>12)
{
alert("please enter the month bettewn 1-12!");
return;
}
year=Math.ceil(document.all.year.value);
month=Math.ceil(document.all.month.value-1);
Calendar();
}

/*******************************************************************************
-- Function show
-- Description: This will populate the calendar in the right position
-- Input: atag   id of div of the calendar
-- Output:
-- 10/10/04 - Created (Cooker)
-- 01/19/05 - Updated (Tom)
********************************************************************************/
function show(atag)
{
var calendar=document.getElementById("DivCalendar");
    var fixedX = -1
var fixedY = -1
var leftpos=40
var toppos=0

tag=atag.id;

if(calendar.style.display=="none")
{
  //var rad=document.getElementById("rdReservation");
  //if(rad.checked==true)
  //{
  calendar.style.display="";

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

    calendar.style.left = fixedX==-1 ? atag.offsetLeft + leftpos : fixedX
   calendar.style.top = fixedY==-1 ? atag.offsetTop + toppos + atag.offsetHeight + 2 : fixedY

//}
}
else
calendar.style.display="none";
}

/*******************************************************************************
-- Function showC
-- Description: This will populate the calendar in the right position
-- Input: atag   id of div of the calendar
-- Output:
-- 11/02/04 - Created (Cooker)
********************************************************************************/
function showC(atag)
{
var calendar=document.getElementById("DivCalendar");
    var fixedX = -1
var fixedY = -1
var leftpos=40
var toppos=0

if(calendar.style.display=="none")
{

  calendar.style.display="";

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

    calendar.style.left = fixedX==-1 ? atag.offsetLeft + leftpos : fixedX
   calendar.style.top = fixedY==-1 ? atag.offsetTop + toppos + atag.offsetHeight + 2 : fixedY

  //2005/01/20 Add (Nancy)
        today=new getToday();
        year=today.year;
        month=today.month;
        Calendar();
  }
else
  calendar.style.display="none";
}

/*******************************************************************************
-- Function showCan
-- Description: This will populate the calendar in the right position
-- Input:        dateTag     name of inputDate
                 canTag      name of divCalendar
-- Output:
-- 10/29/2004   modified from function show()   Nancy
********************************************************************************/
function showCaL(dateTag,calTag)    //aTag txtDate,canTag name of divCalendar
{
var calendar=document.getElementById(calTag);
var atag=document.getElementById(dateTag)
    var fixedX = -1
var fixedY = -1
var leftpos=40
var toppos=0

if(calendar.style.display=="none")
{
    calendar.style.display="";

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

    calendar.style.left = fixedX==-1 ? atag.offsetLeft + leftpos : fixedX
    calendar.style.top = fixedY==-1 ? atag.offsetTop + toppos + atag.offsetHeight + 2 : fixedY
       var DateName =document.getElementById("hdnDateName");
       DateName.value=dateTag

       //2005/01/20 Add (Nancy)
        today=new getToday();
        year=today.year;
        month=today.month;
        Calendar();

}
else
calendar.style.display="none";
}

/*******************************************************************************
-- Function showCan
-- Description: This will populate the calendar in the right position
-- Input:        dateTag     name of inputDate
                 canTag      name of divCalendar
                 LeftSubPos
                 TopSubPos
-- Output:
-- 10/29/2004   modified from function show()   Nancy
********************************************************************************/
function ShowCaLSetPos(dateTag,calTag,LeftSubPos,TopSubPos)    //aTag txtDate,canTag name of divCalendar
{
var calendar=document.getElementById(calTag);
var atag=document.getElementById(dateTag)
    var fixedX = -1
var fixedY = -1
var leftpos=40
var toppos=0

if(calendar.style.display=="none")
{
  calendar.style.display="";

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

    calendar.style.left = fixedX==-1 ? atag.offsetLeft + leftpos+LeftSubPos : fixedX+TopSubPos
    calendar.style.top = fixedY==-1 ? atag.offsetTop + toppos + atag.offsetHeight + 2 : fixedY
       var DateName =document.getElementById("hdnDateName");
       DateName.value=dateTag

     //2005/01/20 Add (Nancy)
        today=new getToday();
        year=today.year;
        month=today.month;
        Calendar();
}
else
  calendar.style.display="none";
}

//******************************************************************88

function ShowCaLSetPos1(dateTag,calTag,LeftSubPos,TopSubPos)    //aTag txtDate,canTag name of divCalendar
{
var calendar=document.getElementById(calTag);
var atag=document.getElementById(dateTag)
    var fixedX = -1
var fixedY = -1
var leftpos=40
var toppos=0

if(calendar.style.display=="none")
{
  calendar.style.display="";

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

    calendar.style.left = fixedX==-1 ? atag.offsetLeft + leftpos+LeftSubPos : fixedX+TopSubPos
    calendar.style.top = fixedY==-1 ? atag.offsetTop + toppos + atag.offsetHeight + 2 : fixedY
       var DateName =document.getElementById("hdnDateName");
       DateName.value=dateTag

     //2005/01/20 Add (Nancy)
        today=new getToday();
        year=today.year;
        month=today.month;
        Calendar();
}
else
  calendar.style.display="none";
}

/*******************************************************************************
-- Function CloseCalendar
-- Description: This will close the calendar
-- Input:
-- Output:
-- 10/10/04 - Created (Cooker)
********************************************************************************/
function CloseCalendar()
{
var calendar=document.getElementById("DivCalendar");
calendar.style.display="none";

}

/*******************************************************************************
-- Function CompareDate
-- Description: This will return the result of the compareDate function
-- Input: date1,date2
-- Output: true, when date1<date2
     false, when date1>=date2
-- 10/10/04 - Created (Cooker)
********************************************************************************/
function CompareDate(date1,date2)
{
if(Date.parse(date1)<Date.parse(date2))
  return true;
else
  return false;
}
function CompareSpanDays()
{
var date1, date2;
if(typeof(document.all["txtFrom"])!="undefined")
  date1 = document.all["txtFrom"].value;
else if(typeof(document.all["txtDateF"])!="undefined")
  date1 = document.all["txtDateF"].value;
else if(typeof(document.all["RptParameter1:txtFrom"])!="undefined")
  date1 = document.all["RptParameter1:txtFrom"].value;
else if(typeof(document.all["RptParameter1:txtDateF"])!="undefined")
  date1 = document.all["RptParameter1:txtDateF"].value;
else
  date1 = "";

if(typeof(document.all["txtTo"])!="undefined")
  date2 = document.all["txtTo"].value;
else if(typeof(document.all["txtDateT"])!="undefined")
  date2 = document.all["txtDateT"].value;
else if(typeof(document.all["RptParameter1:txtTo"])!="undefined")
  date2 = document.all["RptParameter1:txtTo"].value;
else if(typeof(document.all["RptParameter1:txtDateT"])!="undefined")
  date2 = document.all["RptParameter1:txtDateT"].value;
else
  date2 = "";

var MaxSpan = 90;
if(typeof(document.all["Header1_hdnLocalDebug"])!="undefined" && document.all["Header1_hdnLocalDebug"].value=="Y")
MaxSpan = 999;
else if(typeof(document.all["Header1_hdnIISServer"])!="undefined" && document.all["Header1_hdnIISServer"].value=="reports")
MaxSpan = 999;

if(date1.length > 0 && date2.length > 0)
{
  execScript("span=DateDiff('d','" + date1 + "','" + date2 + "')","vbscript");
  if(span > MaxSpan)
  {
   alert("The maximum span days could not be greater than " + MaxSpan + " days.");
   return false;
  }else
   return true;
}else
  return true;
}