欢迎光临
我们一直在努力

javascript做的日历,完全对象化,望高手提出改进意见。(1/3,将3部分拼成一个html文件浏览)

建站超值云服务器,限时71元/月

<html>
<head>
<title>jsmonthview demo</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<script language="javascript">
<!–
//this is jsmonthview 1.0, author is chinese dengkang (2002-07-12).
//i allow your do any modify, but i dont bear any liability.
//browser: ie 4 and later
function definemonthview(thetextobject){ //the month view construct function
  this.getonlyname = function( ){ //create one and only name on the document
    var thename = "mv"; //prefix
    var aryname = new array();
    aryname[0] = "_monthview"; //the month view main bodys name postfix
    aryname[1] = "_monthgrid"; //the month view day areas name postfix
    aryname[2] = "_gopreviousmonth"; //the month view go previous month buttons name postfix
    aryname[3] = "_gonextmonth"; //the month view go next month buttons name postfix
    aryname[4] = "_yearlist"; //the month view year lists name postfix
    aryname[5] = "_monthlist"; //the month view month lists name postfix
    aryname[6] = "_daylist"; //keep the month view current days element name postfix
    var i = -1, j = 0, maxi = 2000;
    var extag = true;
    while ((extag == true) && (i < maxi)){
      i++;
      extag = false;
      for (j=0;j<aryname.length;j++){
        if (document.all.item(thename + i.tostring() + aryname[j]) != null){
          extag = true;
        }
      }
    }
    if (extag == false){
      return(thename + i.tostring());
    }else{
      return("_" + thename);
    }
  }
  var thename = this.getonlyname();
  this.name = thename; //the month view name
  this.source = thetextobject; //the month view act on thetextobject
  this.minyear = 1970; //year list min value
  //return between 1000 and 9999 and <= this.maxyear
  this.maxyear = 2030; //year list max value
  //return between 1000 and 9999 and >= this.minyear
  this.width = 300; //the month view main bodys width
  this.height = 200; //the month view main bodys height
  this.dateformat = "<yyyy>-<mm>-<dd>"; //the date format
  //<yy> or <yyyy> is year, <m> or <mm> is digital format month, <mmm> or <mmmmmm> is character format month, <d> or <dd> is day, other char unchanged
  //this function setting year, month and day sequence
  //example:
  //  <yyyy>-<mm>-<dd> : 2002-04-01
  //  <yy>.<m>.<d> : 02.4.1
  //  <yyyy> year <mmmmmm> month <d> day : 2002 year april month 1 day
  //  <m>/<d>/<yy> : 4/1/02
  //  <mmm> <dd>, <yyyy> : apr 01, 2002
  //  <mmmmmm> <d>, <yyyy> : april 1, 2002
  //  <dd> <mmm> <yyyy> : 01 apr 2002
  //  <dd>/<mm>/<yyyy> : 01/04/2002
  this.unselectbgcolor = "#ffffff"; //the month view default background color
  this.selectedbgcolor = "#808080"; //the selected date background color
  this.selectedcolor = "#ffffff"; //the selected date front color
  this.daybdwidth = "2"; //the day unit border width, unit is px
  this.daybdcolor = this.unselectbgcolor; //the day unit border color,default is this.unselectbgcolor
  this.todaybdcolor = "#ff0000"; //denote todays date border color
  this.invalidcolor = "#808080"; //it is not current month day front color
  this.validcolor = "#0000ff"; //it is current month day front color
  this.weekendbgcolor = this.unselectbgcolor; //the weekend background color, default is this.unselectbgcolor
  this.weekendcolor = this.validcolor; //the weekend front color, default is  this.validcolor
  this.yearliststyle = "font-size:12px; font-family:verdana;"; //the year lists style
  this.monthliststyle = "font-size:12px; font-family:verdana;"; //the month lists style
  this.monthname = new array(); //month name list, font is include this.monthliststyle
  this.monthname[0] = "january";
  this.monthname[1] = "february";
  this.monthname[2] = "march";
  this.monthname[3] = "april";
  this.monthname[4] = "may";
  this.monthname[5] = "june";
  this.monthname[6] = "july";
  this.monthname[7] = "august";
  this.monthname[8] = "september";
  this.monthname[9] = "october";
  this.monthname[10] = "november";
  this.monthname[11] = "december";
  this.titlestyle = "cursor:default; color:#000000; background-color:" + this.unselectbgcolor + "; font-size:16px; font-weight:bolder; font-family:times new roman; text-align:center; vertical-align:bottom;"; //the month view title areas style
  this.weekname = new array(); //week name list, font is include this.titlestyle
  this.weekname[0] = "sun";
  this.weekname[1] = "mon";
  this.weekname[2] = "tue";
  this.weekname[3] = "wed";
  this.weekname[4] = "thu";
  this.weekname[5] = "fri";
  this.weekname[6] = "sat";
  this.footerstyle = "cursor:hand; color:#000000; background-color:" + this.unselectbgcolor + "; font-size:12px; font-family:verdana; text-align:left; vertical-align:middle;"; //the month footer areas style
  this.todaytitle = "today:"; //today tip string, font is include this.footerstyle
  this.monthbtstyle = "font-family:marlett; font-size:12px;"; //the change month button style
  this.previousmonthtext = "3"; //the go previous month button text
  //font is include this.monthbtstyle
  this.nextmonthtext = "4"; //the go next month button text
  //font is include this.monthbtstyle
  this.monthgridstyle = "border-width:1px; border-style:solid; border-color:#000000;"; //the month view main bodys default style
  this.headerstyle = "height:32px; background-color:menu;"; //the month view header areas style
  this.linebgstyle = "height:10px; background-color:" + this.unselectbgcolor + "; text-align:center; vertical-align:middle;"; //the month view title area and day area compart area background style
  this.linestyle = "width:90%; height:1px; background-color:#000000;"; //the month view title area and day area compart area front style
  this.daystyle = "cursor:hand; font-size:12px; font-family:verdana; text-align:center; vertical-align:middle;"; //the month view day areas style
  this.overdaystyle = "this.style.textdecoration=underline;"; //the mouse over a day style
  this.outdaystyle = "this.style.textdecoration=none;"; //the mouse out a day style

  this.getoffsetleft = function(theobject){ //return theobjects absolute offsetleft
    var absleft = 0;
    var theposition="";
    var tmpobject = theobject;
    while (tmpobject != null){
      theposition = tmpobject.position;
      tmpobject.position = "static";
      absleft += tmpobject.offsetleft;
      tmpobject.position = theposition;
      tmpobject = tmpobject.offsetparent;
    }
    return absleft;
  }
  this.getoffsettop = function(theobject){ //return theobjs absolute offsettop
    var abstop = 0;
    var theposition = "";
    var tmpobject = theobject;
    while (tmpobject != null){
      theposition = tmpobject.position;
      tmpobject.position = "static";
      abstop += tmpobject.offsettop;
      tmpobject.position = theposition;
      tmpobject = tmpobject.offsetparent;
    }
    return abstop;
  }
  this.getformatyear = function(theyear){//format theyear to 4 digit
    var tmpyear = theyear;
    if (tmpyear < 100){
      tmpyear += 1900;
      if (tmpyear < 1970){
        tmpyear += 100;
      }
    }
    if (tmpyear < this.minyear){
      tmpyear = this.minyear;
    }
    if (tmpyear > this.maxyear){
      tmpyear = this.maxyear;
    }
    return(tmpyear);
  }
  this.getmonthdays = function(theyear, themonth){ //get theyear and themonth days number
    var thedays = new array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
    var themonthday = 0, tmpyear = this.getformatyear(theyear);
    themonthday = thedays[themonth];
    if (themonth == 1){ //themonth is february
      if(((tmpyear % 4 == 0) && (tmpyear % 100 != 0)) || (tmpyear % 400 == 0)){
        themonthday++;
      }
    }
    return(themonthday);
  }
  this.setdateformat = function(theyear, themonth, theday){//format a date to this.dateformat
    var thedate = this.dateformat;
    var tmpyear = this.getformatyear(theyear);
    var tmpmonth = themonth;
    if (tmpmonth < 0){
      tmpmonth = 0;
    }
    if (tmpmonth > 11){
      tmpmonth = 11;
    }
    var tmpday = theday;
    if (tmpday < 1){
      tmpday = 1;
    }else{
      tmpday = this.getmonthdays(tmpyear, tmpmonth);
      if (theday < tmpday){
        tmpday = theday;
      }
    }
    thedate = thedate.replace(/<yyyy>/g, tmpyear.tostring());
    thedate = thedate.replace(/<yy>/g, tmpyear.tostring().substr(2,2));
    thedate = thedate.replace(/<mmmmmm>/g, this.monthname[tmpmonth]);
    thedate = thedate.replace(/<mmm>/g, this.monthname[tmpmonth].substr(0,3));
    if (themonth < 9){
      thedate = thedate.replace(/<mm>/g, "0" + (tmpmonth + 1).tostring());
    }else{
      thedate = thedate.replace(/<mm>/g, (tmpmonth + 1).tostring());
    }
    thedate = thedate.replace(/<m>/g, (tmpmonth + 1).tostring());
    if (theday < 10){
      thedate = thedate.replace(/<dd>/g, "0" + tmpday.tostring());
    }else{
      thedate = thedate.replace(/<dd>/g, tmpday.tostring());
    }
    thedate = thedate.replace(/<d>/g, tmpday.tostring());
    return(thedate);
  }

赞(0)
版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com 特别注意:本站所有转载文章言论不代表本站观点! 本站所提供的图片等素材,版权归原作者所有,如需使用,请与原作者联系。未经允许不得转载:IDC资讯中心 » javascript做的日历,完全对象化,望高手提出改进意见。(1/3,将3部分拼成一个html文件浏览)
分享到: 更多 (0)

相关推荐

  • 暂无文章