开通博客赚积分
发布资源赚积分
分类

源码开发语言/平台
当前位置：首页 > 源码/资料 > Internet/网络编程 > Web服务器 > 查看源码
simplecalendar.js
资源名称：Nsix.rar　[点击查看]
上传用户：m68239277
上传日期：2014-10-12
资源大小：824k
文件大小：18k
源码类别：

Web服务器

开发平台：

PHP

simplecalendar.js：源码内容
  1. /*
  2. *****************************************************************************************************
  3. Author : Lea Smart
  4. Source : www.totallysmartit.com
  5. Date : 7/3/2001
  6. DHTML Calendar
  7. Version 1.2
  9. You are free to use this code if you retain this header.
  10. You do not need to link to my site (be nice though!)
  12. Amendments
  13. 22 Jan 2002; Added ns resize bug code; rewrote date functions into Date 'class';
  14.  Added support for yyyy-mm-dd date format
  15.  Added support for calendar beginning on any day
  16. 7th Feb 2002 Fixed day highlight when year wasn't current year bug
  17. 9th Jun 2002 Fixed bug with weekend colour
  18.  Amended the code for the date functions extensions.  Shortened addDays code considerably
  19. *****************************************************************************************************
  20. */
  21. var timeoutDelay = 2000; // milliseconds, change this if you like, set to 0 for the calendar to never auto disappear
  22. var g_startDay = 0// 0=sunday, 1=monday
  24. // preload images
  25. var imgUp = new Image(8,12);
  26. //imgUp.src = 'images/up.gif';
  27. var imgDown = new Image(8,12);
  28. //imgDown.src = 'images/down.gif';
  30. // used by timeout auto hide functions
  31. var timeoutId = false;
  33. // the now standard browser sniffer class
  34. function Browser(){
  35.   this.dom = document.getElementById?1:0;
  36.   this.ie4 = (document.all && !this.dom)?1:0;
  37.   this.ns4 = (document.layers && !this.dom)?1:0;
  38.   this.ns6 = (this.dom && !document.all)?1:0;
  39.   this.ie5 = (this.dom && document.all)?1:0;
  40.   this.ok = this.dom || this.ie4 || this.ns4;
  41.   this.platform = navigator.platform;
  42. }
  43. var browser = new Browser();
  45. // dom browsers require this written to the HEAD section
  47. if (browser.dom || browser.ie4){
  48.     document.writeln('<style>');
  49. document.writeln('#container {');
  50. document.writeln('position : absolute;');
  51. document.writeln('left : 100px;');
  52. document.writeln('top : 100px;');
  53. document.writeln('width : 124px;');;
  54. browser.platform=='Win32'?height=140:height=145;
  55. document.writeln('height : ' + height +'px;');
  56. document.writeln('clip:rect(0px 124px ' + height + 'px 0px);');
  57. //document.writeln('overflow : hidden;');
  58. document.writeln('visibility : hidden;');
  59. document.writeln('background-color : #ffffff');
  60. document.writeln('}');
  61. document.writeln('</style>')
  62. document.write('<div id="container"');
  63. if (timeoutDelay) document.write(' onmouseout="calendarTimeout();" onmouseover="if (timeoutId) clearTimeout(timeoutId);"');
  64. document.write('></div>');
  65. }
  67. var g_Calendar;  // global to hold the calendar reference, set by constructor
  69. function calendarTimeout(){
  70.   if (browser.ie4 || browser.ie5){
  71.     if (window.event.srcElement && window.event.srcElement.name!='month') timeoutId=setTimeout('g_Calendar.hide();',timeoutDelay);
  72.   }
  73.   if (browser.ns6 || browser.ns4){
  74.     timeoutId=setTimeout('g_Calendar.hide();',timeoutDelay);
  75.   }
  76. }
  78. // constructor for calendar class
  79. function Calendar(){
  80.   g_Calendar = this;
  81.   // some constants needed throughout the program
  82.   this.daysOfWeek = new Array("Su","Mo","Tu","We","Th","Fr","Sa");
  83.   this.months = new Array("January","February","March","April","May","June","July","August","September","October","November","December");
  84.   this.daysInMonth = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
  85.   
  86.   if (browser.ns4){
  87.     var tmpLayer = new Layer(127);
  88. if (timeoutDelay){
  89.   tmpLayer.captureEvents(Event.MOUSEOVER | Event.MOUSEOUT);
  90.   tmpLayer.onmouseover = function(event) { if (timeoutId) clearTimeout(timeoutId); };
  91.   tmpLayer.onmouseout = function(event) { timeoutId=setTimeout('g_Calendar.hide()',timeoutDelay);};
  92. }
  93.     tmpLayer.x = 100;
  94.     tmpLayer.y = 100;
  95.     tmpLayer.bgColor = "#ffffff";
  96.   }
  97.   if (browser.dom || browser.ie4){
  98. var tmpLayer = browser.dom?document.getElementById('container'):document.all.container;
  99.   }
  100.   this.containerLayer = tmpLayer;
  101.   if (browser.ns4 && browser.platform=='Win32') {
  102.     this.containerLayer.clip.height=134;
  103.     this.containerLayer.clip.width=127;
  104.   }
  106. }
  108.   Calendar.prototype.getFirstDOM = function() {
  109. var thedate = new Date();
  110. thedate.setDate(1);
  111. thedate.setMonth(this.month);
  112. thedate.setFullYear(this.year);
  113. return thedate.getDay();
  114. }
  116. Calendar.prototype.getDaysInMonth = function (){
  117.    if (this.month!=1) {
  118.    return this.daysInMonth[this.month]
  119.    }
  120.    else {
  121.      // is it a leap year
  122.     if (Date.isLeapYear(this.year)) {
  123.   return 29;
  124. }
  125.     else {
  126.   return 28;
  127. }
  128.    }
  129. }
  130.  
  131. Calendar.prototype.buildString = function(){
  132.   var tmpStr = '<form onSubmit="this.year.blur();return false;"><table width="100%" border="0" cellspacing="0" cellpadding="2" class="calBorderColor"><tr><td valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="1" class="calBgColor">';
  133.   tmpStr += '<tr>';
  134.   tmpStr += '<td width="60%" class="cal" align="left">';
  135.   if (this.hasDropDown) {
  136.     tmpStr += '<select class="month" name="month" onchange="g_Calendar.selectChange();">';
  137. for (var i=0;i<this.months.length;i++){
  138.       tmpStr += '<option value="' + i + '"' 
  139.   if (i == this.month) tmpStr += ' selected';
  140.   tmpStr += '>' + this.months[i] + '</option>';
  141.     }
  142.     tmpStr += '</select>';
  143.   } else {
  144.     tmpStr += '<table border="0" cellspacing="0" cellpadding="0"><tr><td><a href="javascript: g_Calendar.changeMonth(-1);"><img name="calendar" src="" width="8" height="12" border="0" alt=""></a></td><td class="cal" width="100%" align="center">' + this.months[this.month] + '</td><td class="cal"><a href="javascript: g_Calendar.changeMonth(+1);"><img name="calendar" src="" width="8" height="12" border="0" alt=""></a></td></tr></table>';
  145.   }
  146.   tmpStr += '</td>';
  147.   /* observation : for some reason if the below event is changed to 'onChange' rather than 'onBlur' it totally crashes IE (4 and 5)!
  148.   */
  149.   tmpStr += '<td width="40%" align="right" class="cal">';
  150.   
  151.   if (this.hasDropDown) { 
  152.     tmpStr += '<input class="year" type="text" size="';
  153.     // get round NS4 win32 lenght of year input problem
  154.     (browser.ns4 && browser.platform=='Win32')?tmpStr += 1:tmpStr += 4;
  155.   tmpStr += '" name="year" maxlength="4" onBlur="g_Calendar.inputChange();" value="' + this.year + '">';
  156.   } else {
  157.   tmpStr += '<table border="0" cellspacing="0" cellpadding="0"><tr><td class="cal"><a href="javascript: g_Calendar.changeYear(-1);"><img name="calendar" src="" width="8" height="12" border="0" alt=""></a></td><td class="cal" width="100%" align="center">' + this.year + '</td><td class="cal"><a href="javascript: g_Calendar.changeYear(+1);"><img name="calendar" src="" width="8" height="12" border="0" alt=""></a></td></tr></table>'
  158.   }
  159.   tmpStr += '</td>';
  160.   tmpStr += '</tr>';
  161.   tmpStr += '</table>';
  162.   var iCount = 1;
  164.   var iFirstDOM = (7+this.getFirstDOM()-g_startDay)%7; // to prevent calling it in a loop
  166.   var iDaysInMonth = this.getDaysInMonth(); // to prevent calling it in a loop
  167.   
  168.   tmpStr += '<table width="100%" border="0" cellspacing="0" cellpadding="1" class="calBgColor">';
  169.   tmpStr += '<tr>';
  170.     for (var i=0;i<7;i++){
  171.   tmpStr += '<td align="center" class="calDaysColor">' + this.daysOfWeek[(g_startDay+i)%7] + '</td>';
  172. }
  173.   tmpStr += '</tr>';
  174.   var tmpFrom = parseInt('' + this.dateFromYear + this.dateFromMonth + this.dateFromDay,10);
  175.   var tmpTo = parseInt('' + this.dateToYear + this.dateToMonth + this.dateToDay,10);
  176.   var tmpCompare;
  177.   for (var j=1;j<=6;j++){
  178.      tmpStr += '<tr>';
  179.      for (var i=1;i<=7;i++){
  180.    tmpStr += '<td width="16" align="center" '
  181.    if ( (7*(j-1) + i)>=iFirstDOM+1  && iCount <= iDaysInMonth){
  182.      if (iCount==this.day && this.year==this.oYear && this.month==this.oMonth) tmpStr += 'class="calHighlightColor"';
  183.  else {
  184.     if (i==7-g_startDay || i==((7-g_startDay)%7)+1) tmpStr += 'class="calWeekend"';
  185. else tmpStr += 'class="cal"';
  186.  }
  187.      tmpStr += '>';
  188.  /* could create a date object here and compare that but probably more efficient to convert to a number
  189.    and compare number as numbers are primitives */
  190.  tmpCompare = parseInt('' + this.year + padZero(this.month) + padZero(iCount),10);
  191.  if (tmpCompare >= tmpFrom && tmpCompare <= tmpTo) {
  192.    tmpStr += '<a class="cal" href="javascript: g_Calendar.clickDay(' + iCount + ');">' + iCount + '</a>';
  193.  } else {
  194.    tmpStr += '<span class="disabled">' + iCount + '</span>';
  195.  }
  196.  iCount++;
  197.    } else {
  198.      if  (i==7-g_startDay || i==((7-g_startDay)%7)+1) tmpStr += 'class="calWeekend"'; else tmpStr +='class="cal"';
  199.  tmpStr += '>&nbsp;';
  200.    }
  201.    tmpStr += '</td>'
  202.  }
  203.  tmpStr += '</tr>'
  204.   }
  205.   tmpStr += '</table></td></tr></table></form>'
  206.   return tmpStr;
  207. }
  209. Calendar.prototype.selectChange = function(){
  210.   this.month = browser.ns6?this.containerLayer.ownerDocument.forms[0].month.selectedIndex:this.containerLayer.document.forms[0].month.selectedIndex;
  211.   this.writeString(this.buildString());
  212. }
  214. Calendar.prototype.inputChange = function(){
  215.   var tmp = browser.ns6?this.containerLayer.ownerDocument.forms[0].year:this.containerLayer.document.forms[0].year;
  216.   if (tmp.value >=1900 || tmp.value <=2100){
  217.     this.year = tmp.value;
  218.     this.writeString(this.buildString());
  219.   } else {
  220.     tmp.value = this.year;
  221.   }
  222. }
  223. Calendar.prototype.changeYear = function(incr){
  224.    (incr==1)?this.year++:this.year--;
  225.    this.writeString(this.buildString());
  226. }
  227. Calendar.prototype.changeMonth = function(incr){
  228.     if (this.month==11 && incr==1){
  229.       this.month = 0;
  230.      this.year++;
  231.     } else {
  232.       if (this.month==0 && incr==-1){
  233.         this.month = 11;
  234.     this.year--;
  235.       } else {
  236.     (incr==1)?this.month++:this.month--;
  237.   }
  238. }
  239. this.writeString(this.buildString());
  240. }
  242. Calendar.prototype.clickDay = function(day){
  243.    var tmp = eval('document.' + this.target);
  244.    tmp.value = this.formatDateAsString(day,this.month,this.year);
  245.     if (browser.ns4) this.containerLayer.hidden=true;
  246.     if (browser.dom || browser.ie4){
  247.       this.containerLayer.style.visibility='hidden';
  248.     }
  249. }
  250. Calendar.prototype.formatDateAsString = function(day, month, year){
  251.   var delim = eval('/\' + this.dateDelim + '/g');
  252.    switch (this.dateFormat.replace(delim,"")){
  253.      case 'ddmmmyyyy': return padZero(day) + this.dateDelim + this.months[month].substr(0,3) + this.dateDelim + year;
  254.              case 'ddmmyyyy': return padZero(day) + this.dateDelim + padZero(month+1) + this.dateDelim + year;
  255.      case 'mmddyyyy': return padZero((month+1)) + this.dateDelim + padZero(day) + this.dateDelim + year;
  256.      case 'yyyymmdd': return year + this.dateDelim + padZero(month+1) + this.dateDelim + padZero(day);
  257.      case 'yyyymmdd': return year + this.dateDelim + padZero(month+1) + this.dateDelim + padZero(day);
  258.      case 'yyyy-mm-dd': return year + this.dateDelim + padZero(month+1) + this.dateDelim + padZero(day);
  259.      case 'yyyymmdd': return year  + padZero(month+1)  + padZero(day);
  260.  default: alert('unsupported date format');
  261.    }
  262. }
  263. Calendar.prototype.writeString = function(str){
  264.   if (browser.ns4){
  265.     this.containerLayer.document.open();
  266.     this.containerLayer.document.write(str);
  267.     this.containerLayer.document.close();
  268.   } 
  269.   if (browser.dom || browser.ie4){
  270.     this.containerLayer.innerHTML = str;
  271.   }
  272. }
  274. Calendar.prototype.show = function(event, target, bHasDropDown, dateFormat, dateFrom, dateTo){
  275. // calendar can restrict choices between 2 dates, if however no restrictions
  276. // are made, let them choose any date between 1900 and 3000
  277. this.dateFrom = dateFrom || new Date(1900,0,1);
  278. this.dateFromDay = padZero(this.dateFrom.getDate());
  279. this.dateFromMonth = padZero(this.dateFrom.getMonth());
  280. this.dateFromYear = this.dateFrom.getFullYear();
  281. this.dateTo = dateTo || new Date(3000,0,1);
  282. this.dateToDay = padZero(this.dateTo.getDate());
  283. this.dateToMonth = padZero(this.dateTo.getMonth());
  284. this.dateToYear = this.dateTo.getFullYear();
  285. this.hasDropDown = bHasDropDown;
  286. this.dateFormat = dateFormat || 'dd-mmm-yyyy';
  287. switch (this.dateFormat){
  288.   case 'dd-mmm-yyyy':
  289.   case 'dd-mm-yyyy':
  290.   case 'yyyy-mm-dd':
  291.         this.dateDelim = '-';
  292. break;
  293.   case 'dd/mm/yyyy':
  294.   case 'mm/dd/yyyy':
  295.   case 'dd/mmm/yyyy':
  296.     this.dateDelim = '/';
  297. break;
  298. }
  300.   if (browser.ns4) {
  301.     if (!this.containerLayer.hidden) {
  302.   this.containerLayer.hidden=true;
  303.   return;
  304. }
  305.    }
  306.   if (browser.dom || browser.ie4){
  307.     if (this.containerLayer.style.visibility=='visible') {
  308.   this.containerLayer.style.visibility='hidden';
  309.   return;
  310. }  
  311.   }
  313.   if (browser.ie5 || browser.ie4){
  314.     var event = window.event;
  315.   }
  316.   if (browser.ns4){
  317.     this.containerLayer.x = event.x+10;
  318.     this.containerLayer.y = event.y-5;
  319.   }
  320.   if (browser.ie5 || browser.ie4){
  321.     var obj = event.srcElement;
  322.       x = 0;
  323.    while (obj.offsetParent != null) {
  324.        x += obj.offsetLeft;
  325.        obj = obj.offsetParent;
  326.    }
  327.    x += obj.offsetLeft;
  328.     y = 0;
  329. var obj = event.srcElement;
  330.     while (obj.offsetParent != null) {
  331.        y += obj.offsetTop;
  332.        obj = obj.offsetParent;
  333.    }
  334.    y += obj.offsetTop;
  336.         this.containerLayer.style.left = x;
  337. if (event.y>0)this.containerLayer.style.top = y+20;
  338.   }
  339.   if (browser.ns6){
  340.     this.containerLayer.style.left = event.pageX+10;
  341. this.containerLayer.style.top = event.pageY-5;
  342.   }
  343.   this.target = target;
  344.   var tmp = eval('document.' + this.target);
  345.   if (tmp && tmp.value && tmp.value.split(this.dateDelim).length==3 && tmp.value.indexOf('d')==-1){
  346.     var atmp = tmp.value.split(this.dateDelim)
  347. switch (this.dateFormat){
  348.  case 'dd-mmm-yyyy':
  349.  case 'dd/mmm/yyyy':
  350.    for (var i=0;i<this.months.length;i++){
  351.      if (atmp[1].toLowerCase()==this.months[i].substr(0,3).toLowerCase()){
  352.        this.month = this.oMonth = i;
  353.    break;
  354.      }
  355.    }
  356.    this.day = parseInt(atmp[0],10);
  357.    this.year = this.oYear = parseInt(atmp[2],10);
  358.    break;
  359.  case 'dd/mm/yyyy':
  360.  case 'dd-mm-yyyy':
  361.    this.month = this.oMonth = parseInt(atmp[1]-1,10); 
  362.    this.day = parseInt(atmp[0],10);
  363.    this.year = this.oYear = parseInt(atmp[2],10);
  364.    break;
  365.  case 'mm/dd/yyyy':
  366.  case 'mm-dd-yyyy':
  367.    this.month = this.oMonth = parseInt(atmp[0]-1,10);
  368.    this.day = parseInt(atmp[1],10);
  369.    this.year = this.oYear = parseInt(atmp[2],10);
  370.    break;
  371.  case 'yyyy-mm-dd':
  372.    this.month = this.oMonth = parseInt(atmp[1]-1,10);
  373.    this.day = parseInt(atmp[2],10);
  374.    this.year = this.oYear = parseInt(atmp[0],10);
  375.    break;
  376. }
  377.   } else { // no date set, default to today
  378.     var theDate = new Date();
  379.     this.year = this.oYear = theDate.getFullYear();
  380.      this.month = this.oMonth = theDate.getMonth();
  381.      this.day = this.oDay = theDate.getDate();
  382.   }
  383.   this.writeString(this.buildString());
  384.   
  385.   // and then show it!
  386.    if (browser.ns4) {
  387.    this.containerLayer.hidden=false;
  388.    }
  389.   if (browser.dom || browser.ie4){
  390.       this.containerLayer.style.visibility='visible';
  391.   }
  392. }
  394. Calendar.prototype.hide = function(){
  395.   if (browser.ns4) this.containerLayer.hidden = true;
  396.   if (browser.dom || browser.ie4){
  397.     this.containerLayer.style.visibility='hidden';
  398.   }
  399. }
  401. function handleDocumentClick(e){
  402.   if (browser.ie4 || browser.ie5) e = window.event;
  404.   if (browser.ns6){
  405.     var bTest = (e.pageX > parseInt(g_Calendar.containerLayer.style.left,10) && e.pageX <  (parseInt(g_Calendar.containerLayer.style.left,10)+125) && e.pageY < (parseInt(g_Calendar.containerLayer.style.top,10)+125) && e.pageY > parseInt(g_Calendar.containerLayer.style.top,10));
  406.     if (e.target.name!='imgCalendar' && e.target.name!='month'  && e.target.name!='year' && e.target.name!='calendar' && !bTest){
  407.   g_Calendar.hide(); 
  408. }
  409.   }
  410.   if (browser.ie4 || browser.ie5){
  411. // extra test to see if user clicked inside the calendar but not on a valid date, we don't want it to disappear in this case
  412.    var bTest = (e.x > parseInt(g_Calendar.containerLayer.style.left,10) && e.x <  (parseInt(g_Calendar.containerLayer.style.left,10)+125) && e.y < (parseInt(g_Calendar.containerLayer.style.top,10)+125) && e.y > parseInt(g_Calendar.containerLayer.style.top,10));
  413.     if (e.srcElement.name!='imgCalendar' && e.srcElement.name!='month' && e.srcElement.name!='year' && !bTest & typeof(e.srcElement)!='object'){
  414.   g_Calendar.hide(); 
  415. }
  416.   }
  417.   if (browser.ns4) g_Calendar.hide();
  418. }
  420. // utility function
  421. function padZero(num) {
  422.   return ((num <= 9) ? ("0" + num) : num);
  423. }
  424.   // Finally licked extending  native date object;
  425.   Date.isLeapYear = function(year){ if (year%4==0 && ((year%100!=0) || (year%400==0))) return true; else return false; }
  426.   Date.daysInYear = function(year){ if (Date.isLeapYear(year)) return 366; else return 365;}
  427.   var DAY = 1000*60*60*24;
  428.   Date.prototype.addDays = function(num){
  429. return new Date((num*DAY)+this.valueOf());
  430.   }
  431.   
  432.  // events capturing, careful you don't override this by setting something in the onload event of 
  433. // the body tag
  434. window.onload=function(){ 
  435.   new Calendar(new Date());
  436.   if (browser.ns4){
  437.     if (typeof document.NSfix == 'undefined'){
  438.   document.NSfix = new Object();
  439.       document.NSfix.initWidth=window.innerWidth;
  440.   document.NSfix.initHeight=window.innerHeight;
  441. }
  442.   }
  443. }
  444. if (browser.ns4) window.onresize = function(){
  445.   if (document.NSfix.initWidth!=window.innerWidth || document.NSfix.initHeight!=window.innerHeight) window.location.reload(false);
  446. } // ns4 resize bug workaround
  447. window.document.onclick=handleDocumentClick;
  448.     window.onerror = function(msg,url,line){
  449.   alert('******* an error has occurred ********' +
  450.   'nnPlease check that' + 
  451.   'nn1)You have not added any code to the body onload event,'
  452.   +  'nif you want to run something as well as the calendar initialisation'
  453.   + 'ncode, add it to the onload event in the calendar library.'
  454.   + 'nn2)You have set the parameters correctly in the g_Calendar.show() method '
  455.   + 'nnSee www.totallysmartit.com\examples\calendar\simple.asp for examples'
  456.   + 'nn------------------------------------------------------'
  457.   + 'nError details'
  458.   + 'nText:' + msg + 'nurl:' + url + 'nline:' + line);
  459. }