http://expert.csdn.net/Expert/TopicView1.asp?id=1264734 可以参考一下

解决方案 »

  1.   

    懒得改你的,不如我给你一个吧,很不错的哦。代码如下:
    <html>
    <head>
    <title>画一个日历</title>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <script language="JavaScript">
    <!--function gettime()//获取当前时间
     {
      var now=new Date();
      var hour=now.getHours();
      var minute=now.getMinutes();
      var second=now.getSeconds();
      var ampm="";
      if (hour>=12)
       {
         hour-=12;
     ampm="PM";
       }else
         ampm="AM";
       hour=(hour==0)?12:hour;
       if (minute<10)
          minute="0"+minute;
       if (second<10)
          second="0"+second;
    var aaa=hour+":"+minute+":"+second+" "+ampm;
        window.status=aaa;
    setTimeout("gettime()",1000); 
     }
     
    function leapyear(year)//判断是否闰年
      {
        if((year%4==0&&year%100!=0)||year%400==0)
      return true;
    return false;  
      }
      
    function getdays(month,year)//取得各月的天数
      {
        var ar=new Array(12);
      ar[0]=31;
      ar[1]=((leapyear(year))?29:28);
      ar[2]=31;
      ar[3]=30;
      ar[4]=31;
      ar[5]=30;
      ar[6]=31;
      ar[7]=31;
      ar[8]=30;
      ar[9]=31;
      ar[10]=30;
      ar[11]=31;
    return ar[month];  
      }
     
    function getmonthname(month)//取得各月的英文名称
      {
        var ar=new Array(12);
      ar[0]="January";
      ar[1]="February";
      ar[2]="March";
      ar[3]="April";
      ar[4]="May";
      ar[5]="June";
      ar[6]="July";
      ar[7]="August";
      ar[8]="September";
      ar[9]="October";
      ar[10]="November";
      ar[11]="December";
    return ar[month];
      } 
      
    function drawcal(firstday,lastdate,date,monthname,year)//绘制日历表格
      {
        var headerheight=50;
    var border=1;
    var cellspacing=1;
    var headercolor="midnightblue";
    var headersize="+2";
    var colwidth=10;
    var daycellheight=10;
    var daycolor="darkbule";
    var cellheight=10;
    var todaycolor="yellow";
    var timecolor="purple";
    var text="";

    text+='<center><table border='+border+' bordercolor="#0000ff" cellspacing='+cellspacing+'>';
    text+='<th colspan=7 height='+headerheight+'>';
    text+='<font color="'+headercolor+'" size='+headersize+'>';
    text+=monthname+'  '+year;
    text+='</font></th>';

    var opencol='<td width='+colwidth+' height='+daycellheight+' bgcolor="fff000">';
    opencol+='<font color="'+daycolor+'">';
    var closecol='</font></td>';

    var weekday=new Array(7);
    weekday[0]="日";
    weekday[1]="一";
    weekday[2]="二";
    weekday[3]="三";
    weekday[4]="四";
    weekday[5]="五";
    weekday[6]="六";

    text+='<tr align="center" valign="center">';
    for (var daynum=0;daynum<7;++daynum)
     {
      text+=opencol+weekday[daynum]+closecol;
     }
    text+='</tr>';

    var digit=1;
    var curcell=1;

    for (var row=1;row<=Math.ceil((lastdate+firstday-1)/7);++row)
     {
       text+='<tr align="right" valign="top">';
       for (var col=1;col<=7;++col)
        {
      if (digit>lastdate)
        break;
      if (curcell<firstday)
        {
      text+='<td></td>';
      curcell++;
    }else
     {
      if (digit==date)
        {
      text+='<td height='+cellheight+' bgcolor="#339900">';
      text+='<font color="'+todaycolor+'">';
      text+=digit;
      text+='</font></td>';
    }else
       text+='<td height='+cellheight+' bgcolor="fff000">'+digit+'</td>';
    digit++;   
     }
    }
    text+='</tr>';
     } 
     text+='</table></center>';
     mydate.innerHTML=text;
      }     
      
    function setcal()//设定表格参数
      {
        var now=new Date();
    var year=now.getYear();
    var month=now.getMonth();
    var monthname=getmonthname(month);
    var date=now.getDate();
    now=null;

    var firstdayinstance=new Date(year,month,1);
    var firstday=firstdayinstance.getDay();
    firstdayinstance=null;

    var days=getdays(month,year);

    drawcal(firstday+1,days,date,monthname,year);
      }
    //-->
    </script>
    </head><body bgcolor="#FFFFFF" text="#000000" onLoad="setcal();" onmouseover="gettime();">
    <div id="mydate" align="center" style="font-size: 20; color:#000000"></div>
    </body>
    </html>觉得怎么样,是不是非要你自己那个呢?有空再给你改吧。
      

  2.   

    http://www.csfly007.com/fu.htm
    这个网址没有
      

  3.   

    本来我是想改一下自己的程序来给这位朋友的,
    可是我改的时候自己也有问题出现,希望大家帮帮忙!
    问题出在中间有文字标示的的地方。
    目前只能实现对年或者对月的单个动作,两个动作不能同步,也就是年和月不关联。
    <html>
    <head>
    <title>画一个日历</title>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <script language="JavaScript">
    <!--function gettime()//获取当前时间
     {
      var now=new Date();
      var hour=now.getHours();
      var minute=now.getMinutes();
      var second=now.getSeconds();
      var ampm="";
      if (hour>=12)
       {
         hour-=12;
     ampm="PM";
       }else
         ampm="AM";
       hour=(hour==0)?12:hour;
       if (minute<10)
          minute="0"+minute;
       if (second<10)
          second="0"+second;
    var aaa=hour+":"+minute+":"+second+" "+ampm;
        window.status=aaa;
    setTimeout("gettime()",1000); 
     }
     
    function leapyear(year)//判断是否闰年
      {
        if((year%4==0&&year%100!=0)||year%400==0)
      return true;
    return false;  
      }
      
    function getdays(month,year)//取得各月的天数
      {
        var ar=new Array(12);
      ar[0]=31;
      ar[1]=((leapyear(year))?29:28);
      ar[2]=31;
      ar[3]=30;
      ar[4]=31;
      ar[5]=30;
      ar[6]=31;
      ar[7]=31;
      ar[8]=30;
      ar[9]=31;
      ar[10]=30;
      ar[11]=31;
    return ar[month];  
      }
     
    function getmonthname(month)//取得各月的英文名称
      {
        var ar=new Array(12);
      ar[0]="January";
      ar[1]="February";
      ar[2]="March";
      ar[3]="April";
      ar[4]="May";
      ar[5]="June";
      ar[6]="July";
      ar[7]="August";
      ar[8]="September";
      ar[9]="October";
      ar[10]="November";
      ar[11]="December";
    return ar[month];
      }  var text=""; 
        var text2="";
    var thismonth=new Date();
    year=thismonth.getYear();
    monthnum=thismonth.getMonth();
    //主要是这个函数让我搞不懂,它的作用是打印出年和月的下拉式菜单,再单击就可以显示相应的年和月了 
    function ny(monthnum,year)
      {
    text2+="<table border='0'><tr><td colspan='7'><form name='form2' method='post' action='' onSubmit='return flase;'>";
    //下面一行中的setcal2()中的两个参数为什么不能全用变量来代替
    //比如setcal2(form2.SM.options[selectedIndex].value-1,form2.SY.options[selectedIndex].value)这样子就会出错。?
    text2+="<select name=SY onchange='setcal2(1,form2.SY.options[selectedIndex].value);' style='FONT-SIZE: 9pt'>";
               for(var i=1900;i<2050;i++)
         {
      if(i==year)
        {
      text2+='<option value='+i+' selected>'+i;
      continue;
     }
      text2+='<option value='+i+'>'+i;
      }
            text2+="</select><font style='FONT-SIZE: 11pt'>年</font>" ;
    //下面一行中的setcal2()中的两个参数为什么也不能全用变量来代替
    //比如setcal2(form2.SM.options[selectedIndex].value,form2.SY.options[selectedIndex].value)这样子就会出错。
            text2+="<select name=SM onchange='setcal2(form2.SM.options[selectedIndex].value-1,1988);' style='FONT-SIZE: 9pt'>";
               for(var i=1;i<13;i++)
         {
      if(i==monthnum+1)
        {
      text2+='<option value='+i+' selected>'+i;
      continue;
     }
      text2+='<option value='+i+'>'+i;   
      }
            text2+="</select><font style='FONT-SIZE: 11pt'>月</font></form></td></tr></table>";
    mydate2.innerHTML=text2;   
      }
      
    function drawcal(firstday,lastdate,date,monthname,year)//绘制日历表格
      {
        var headerheight=50;
    var border=1;
    var cellspacing=1;
    var headercolor="midnightblue";
    var headersize="+2";
    var colwidth=10;
    var daycellheight=10;
    var daycolor="darkbule";
    var cellheight=10;
    var todaycolor="yellow";
    var timecolor="purple";

    text+='<center><table border='+border+' bordercolor="#0000ff" cellspacing='+cellspacing+'>';
    text+='<th colspan=7 height='+headerheight+'>';
    text+='<font color="'+headercolor+'" size='+headersize+'>';
    text+=monthname+'  '+year;
    text+='</font></th>';

    var opencol='<td width='+colwidth+' height='+daycellheight+' bgcolor="fff000">';
    opencol+='<font color="'+daycolor+'">';
    var closecol='</font></td>';

    var weekday=new Array(7);
    weekday[0]="日";
    weekday[1]="一";
    weekday[2]="二";
    weekday[3]="三";
    weekday[4]="四";
    weekday[5]="五";
    weekday[6]="六";

    text+='<tr align="center" valign="center">';
    for (var daynum=0;daynum<7;++daynum)
     {
      text+=opencol+weekday[daynum]+closecol;
     }
    text+='</tr>';

    var digit=1;
    var curcell=1;

    for (var row=1;row<=Math.ceil((lastdate+firstday-1)/7);++row)
     {
       text+='<tr align="right" valign="top">';
       for (var col=1;col<=7;++col)
        {
      if (digit>lastdate)
        break;
      if (curcell<firstday)
        {
      text+='<td></td>';
      curcell++;
    }else
     {
      if (digit==date)
        {
      text+='<td height='+cellheight+' bgcolor="#339900">';
      text+='<font color="'+todaycolor+'">';
      text+=digit;
      text+='</font></td>';
    }else
       text+='<td height='+cellheight+' bgcolor="fff000">'+digit+'</td>';
    digit++;   
     }
    }
    text+='</tr>';
    }
     text+='</table></center>';
     mydate.innerHTML=text;
      }     
      
    function setcal()//设定表格参数
      {
        var now=new Date();
    var year=now.getYear();
    var month=now.getMonth();
    var monthname=getmonthname(month);
    var date=now.getDate();
    now=null;

    var firstdayinstance=new Date(year,month,1);
    var firstday=firstdayinstance.getDay();
    firstdayinstance=null;

    var days=getdays(month,year);
    ny(monthnum,year);
    drawcal(firstday+1,days,date,monthname,year);
      }
      
      
    function setcal2(month,year)//选择年月后的反应
      { 
        var now=new Date();
    var monthname=getmonthname(month);
    var date=now.getDate();
    now=null;

    var firstdayinstance=new Date(year,month,1);
    var firstday=firstdayinstance.getDay();
    firstdayinstance=null;

    var days=getdays(month,year);
    text='';

    drawcal(firstday+1,days,date,monthname,year);
      }  
    //-->
    </script>
    </head><body bgcolor="#FFFFFF" text="#000000" onLoad="setcal();" >
    <div id="mydate" align="center" style="font-size: 20; color:#000000"></div>
    <div id="mydate2" align="center" style="font-size: 20; color:#000000"></div>
    </body>
    </html>
      

  4.   

    我也看了看你的程序,不过我也调不出来
    给你一个很好的控件例子,可以参考一下
    http://hazeline.vip.sina.com/calendar.htm
      

  5.   

    代码本身没有太大问题,关键是需要与服务器交互。输出使用了document.write,所以当选择后写到新窗口去了。由于新窗口中没有js当然就不会动了。
    就你的代码简单的改了一下:
    1、body段改为
    <BODY TEXT="#000000" TOPMARGIN="0">
    <span id="view"></span>
    <script language="JavaScript" type="text/javascript">
    calendar(tY,tM); //显示月历
    var buffer="";
    function myprint(str) { //用于缓存输出
      buffer += str;
    }
    </script>
    </BODY> 
    2、将原有的document.write和document.writeln替换成myprint
    3、修改calendar函数
    function calendar(Y,M) {
    buffer = ""; //清空缓存原来的内容view.innerHTML = buffer; //输出日历
      document.time.SY.selectedIndex=Y-1900; //设置年
      document.time.SM.selectedIndex=M; //设置月
    }其余部分不变
      

  6.   

    大家到这里看看,
    http://www.solarstones.com/wzq/
    我第一次写的,帮我测试一下好吗?
      

  7.   

    xuzuning(唠叨) 
    实在不好意思,我试过了,还是不行,能不能将你调试过的程序给我呢
    我不知道是哪里改错了十分感谢
      

  8.   

    不会吧,xhping801216 (),我上次给你发的两个网址都打不开吗?唉,还是把原码贴给你(把下面两部分拼起来):
    <html>
    <head>
    <title>剑三十</title>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    </head><body bgcolor="#FFFFFF" onClick="hiddenCal()">
    <style>
    BODY {FONT-SIZE: 9pt; MARGIN-LEFT: 0px; MARGIN-TOP: 2px; TEXT-ALIGN: center}
    .boxinput{BORDER: #000000 1pt solid; background-color: #F2F2F2;FONT-SIZE: 9pt;}
    </style>
    <script language="JavaScript">
    var activeDate = new Date();var tbl = window.document.createElement("<TABLE style=\"background:white;border:1px solid #003399;width:100%;height:100%;font:9pt arial;\" cellspacing=0>");
    var tblhd = window.document.createElement("THEAD");
    var tblbd = window.document.createElement("TBODY"); var anchorPriorYear = window.document.createElement("A");
    anchorPriorYear.style.fontFamily = "webdings"; 
    anchorPriorYear.style.color="white";
    anchorPriorYear.style.cursor = "hand";
    anchorPriorYear.innerText = "7";
    anchorPriorYear.title = "上一年"; 
    var anchorPriorMonth = window.document.createElement("A"); 
    anchorPriorMonth.style.fontFamily = "webdings"; 
    anchorPriorMonth.style.color="white";
    anchorPriorMonth.style.cursor = "hand"; 
    anchorPriorMonth.innerText = "3"; 
    anchorPriorMonth.title = "上一月"; 
    var anchorNextMonth = window.document.createElement("A"); 
    anchorNextMonth.style.fontFamily = "webdings"; 
    anchorNextMonth.style.cursor = "hand"; 
    anchorNextMonth.style.color="white"; 
    anchorNextMonth.innerText = "4"; 
    anchorNextMonth.title = "下一月"; 
    var anchorNextYear = window.document.createElement("A"); 
    anchorNextYear.style.fontFamily = "webdings"; 
    anchorNextYear.style.cursor = "hand";
    anchorNextYear.style.color= "white";
    anchorNextYear.innerText = "8";
    anchorNextYear.title = "下一年"; 
    var anchorClose = window.document.createElement("A"); 
    anchorClose.style.fontFamily = "wingdings"; 
    anchorClose.style.cursor = "hand";
    anchorClose.style.color= "white";
    anchorClose.innerText = "x";
    anchorClose.title = "关闭"; 
    var anchorClear = window.document.createElement("A"); 
    anchorClear.style.fontFamily = "wingdings"; 
    anchorClear.style.cursor = "hand";
    anchorClear.style.color= "white";
    anchorClear.innerText = "/";
    anchorClear.title = "清空"; 
    var anchorCurrent = window.document.createElement("A"); 
    anchorCurrent.style.fontFamily = "webdings"; 
    anchorCurrent.style.cursor = "hand";
    anchorCurrent.style.color= "white";
    anchorCurrent.innerText = "q";
    anchorCurrent.title = "回到当前日期"; 
    var inputYear = window.document.createElement(""); var goButton= window.document.createElement("A"); var ynm = window.document.createElement("FONT");
    ynm.style.width = "60%"; 
    ynm.style.fontWeight = "bold"; 
    var cpt = window.document.createElement("CAPTION"); 
    var tblfd = window.document.createElement("TFOOT"); 
    tbl.appendChild(cpt);
    tbl.appendChild(tblhd);
    tbl.appendChild(tblbd);
    tbl.appendChild(tblfd);var fillInput;
    var calshow=false;window.onload=function(){
    initcal();
    }function initcal(){
    inithead();
    initbody();
    inittail();
    calendar.appendChild(tbl);
    fillCalendar(activeDate);
    tblbd.attachEvent("onclick",selectDate);
    tblbd.attachEvent("onkeydown",moveDate);   
    anchorPriorYear.attachEvent("onclick",goPriorYear);   
    anchorPriorMonth.attachEvent("onclick",goPriorMonth);
    anchorNextMonth.attachEvent("onclick",goNextMonth);
    anchorNextYear.attachEvent("onclick",goNextYear); 
    anchorClose.attachEvent("onclick",closeCalendar); 
    anchorClear.attachEvent("onclick",clearValue); 
    anchorCurrent.attachEvent("onclick",goCurrent); 
    goButton.attachEvent("onclick",goYear); 
    } function inithead(){ 
    cpt.style.backgroundColor = "#003399";   
    cpt.style.color = "white";
    cpt.style.textAlign = "center";
    cpt.appendChild(anchorPriorYear);
    cpt.appendChild(anchorPriorMonth);
    cpt.appendChild(ynm);
    cpt.appendChild(anchorNextMonth);
    cpt.appendChild(anchorNextYear);
    var row = tblhd.insertRow();
    row.align = "center"; 
    var weekStr = new Array("日","一","二","三","四","五","六");
    for (var i=0;i<weekStr.length;i++){
    var cell = row.insertCell();
    cell.innerText = weekStr[i]; 
    cell.style.borderBottom = "solid 1px"; 
    cell.style.cursor = "default";
    cell.align = "center";  
    if(i==0||i==6)cell.style.color="red";
    }
    }
      

  9.   


    function initbody(){
    for (var i=0;i<6;i++){
    var row = tblbd.insertRow();
    for (var j=0;j<7;j++){
    var cell = row.insertCell();
    cell.innerHTML = "&nbsp;";
    cell.style.cursor = "default";
    cell.align = "center"; 
    }
    }
    }function inittail(){
    var row = tblfd.insertRow();
    row.style.backgroundColor = "#003399";   
    row.style.color = "white";
    var cell = row.insertCell();
    cell.colSpan=3
    cell.style.height=7
    cell.style.paddingLeft="4px";
    cell.align = "left"; 
    cell.appendChild(inputYear);
    cell.appendChild(goButton);
    cell = row.insertCell();
    cell.colSpan=4;
    cell.align = "right"; 
    cell.appendChild(anchorClear);
    cell.appendChild(anchorCurrent);
    cell.appendChild(anchorClose);
    }function fillCalendar(adate){
    ynm.innerText = adate.getFullYear() + "年" + (adate.getMonth() + 1) + "月"; 
    var tempdate = new Date(); 
    tempdate.setFullYear(adate.getFullYear(),adate.getMonth(),1);
    var first = true;
    for (var i=0;i<tblbd.rows.length;i++){ 
    for (var j=0;j<tblbd.rows(i).cells.length;j++){
    var cell = tblbd.rows(i).cells(j);
    cell.innerHTML = "&nbsp;"; 
    cell.bgcolor = "";
    cell.title = "";
    if(j==0||j==6) cell.style.color="red";
    else cell.style.color="black";
    cell.style.backgroundColor = ""; 
    if (tempdate.getDay() == j){ 
    if (!first) continue; 
    cell.innerText = tempdate.getDate();
    var today=new Date(); 
    if (tempdate.getDate() == activeDate.getDate()){
    cell.setAttribute("active",true);
    hightLightDate(cell); 
    }
    tempdate.setFullYear(tempdate.getFullYear(),tempdate.getMonth(),tempdate.getDate()+1);
    first = tempdate.getDate() > 1;
    }
    }
    }
    }function hightLightDate(object){
    var tds = tblbd.all.tags("TD");
    for (var i=0;i<tds.length;i++){
    if (tds(i) != object){
    tds(i).style.backgroundColor = tds(i).bgcolor; 
    tds(i).style.color = tds(i).style.color
    }
    else{  
    tds(i).style.backgroundColor = "red"; 
    tds(i).style.color = "white"; 
    }
    }
    }function selectDate(){
    var i = parseInt(window.event.srcElement.innerText);
    if ((!isNaN(i)) && (i<3000)){
    activeDate.setFullYear(activeDate.getFullYear(),activeDate.getMonth(),i);     

    fillCalendar(activeDate);
    closeCalendar(); }
    fill();
    }function fill(){
    fillInput.value=activeDate.getFullYear()+'-'+(activeDate.getMonth()+1)+"-"+activeDate.getDate();
    }function moveDate(){
    var k = window.event.keyCode;
    switch(k){
    case 37:       activeDate.setFullYear(activeDate.getFullYear(),activeDate.getMonth(),activeDate.getDate()-1); 
    break;
    case 38:       activeDate.setFullYear(activeDate.getFullYear(),activeDate.getMonth(),activeDate.getDate()-7); 
    break;
    case 39:       activeDate.setFullYear(activeDate.getFullYear(),activeDate.getMonth(),activeDate.getDate()+1);
    break;
    case 40:       activeDate.setFullYear(activeDate.getFullYear(),activeDate.getMonth(),activeDate.getDate()+7);
    break;
    }  
    fillCalendar(activeDate);
    fill();
    }function goNextMonth(){
    activeDate.setMonth(activeDate.getMonth()+1,activeDate.getDate());
    fillCalendar(activeDate); 
    fill();
    }function goNextYear(){   
    activeDate.setFullYear(activeDate.getFullYear()+1,activeDate.getMonth(),activeDate.getDate());
    fillCalendar(activeDate); 
    fill();
    }
    function goPriorYear(){ activeDate.setFullYear(activeDate.getFullYear()-1,activeDate.getMonth(),activeDate.getDate()); 
    fillCalendar(activeDate); fill(); } function goYear(){ activeDate.setFullYear(inputYear.value,activeDate.getMonth(),activeDate.getDate()); 
    fillCalendar(activeDate); fill(); } function goPriorMonth(){ activeDate.setMonth(activeDate.getMonth()-1,activeDate.getDate()); 
    fillCalendar(activeDate); fill(); } function clearValue(){ fillInput.value=""; 
    } function goCurrent(){ activeDate=new Date(); fillCalendar(activeDate); fill(); 
    } function showCalendar(e){ calendar.style.top=e.offsetTop+e.offsetHeight; calendar.style.left=e.offsetLeft; 
    calshow=true; fillInput=e; calendar.style.display="block"; } function hiddenCal() 
    { if(!calshow)calendar.style.display="none"; } function closeCalendar() { calshow=false; 
    calendar.style.display="none"; }
    </script>
     开始日期: 
    <input type="TEXT" onFocus="showCalendar(this);this.blur();"  class="boxinput" onMouseOut="calshow=false" name="TEXT"/>
    结束日期:
    <input type="TEXT" onFocus="showCalendar(this);this.blur();" class="boxinput" onMouseOut="calshow=false" name="TEXT2"/>
    <div id="calendar" style="position:absolute;height:140px;width:160px;display:none;border:1px inset #003399;"  onMouseOver="calshow=true" onMouseOut="calshow=false"/></div> 
    </body>
    <p>&nbsp;</p>
    <p> 
      <input type="TEXT" onFocus="showCalendar(this);this.blur();" class="boxinput" onMouseOut="calshow=false" name="TEXT22"/>
      <input type="text" onFocus="showCalendar(this);this.blur();"  onMouseOut="calshow=false" name="TEXT220">
    </p>
    </body>
    </html>