JS日历,(万年历)功能和界面都挺好的

原创 2007年09月27日 16:08:00

<style type="text/css">
.body,td{font-family:"Arial";font-size:8pt;color:#000000;}
.TrOut{background:#dddddd;height:26;border:1 solid #999999;border-top-color:#f4f4f4;border-left-color:#f4f4f4;}
.TdOver{background:#eeeeee;height:20;border:1 solid #ffffff;border-top-color:#9c9c9c;border-left-color:#9c9c9c;}
.TdOut{background:#eeeeee;height:20;border:1 solid #9c9c9c;border-top-color:#ffffff;border-left-color:#ffffff;}
</style>
<Script language="JScript" defer>
function TableFunction(){
    this.GetDateStr=function(y,m){
        this.DayArray=[];
        for(var i=0;i<42;i++)this.DayArray[i]=" ";
        for(var i=0;i<new Date(y,m,0).getDate();i++)this.DayArray[i+new Date(y,m-1,1).getDay()]=i+1;
        return this.DayArray;
        }
    this.GetTableStr=function(y,m){
        this.DateArray=["日","一","二","三","四","五","六"];
        this.DStr="<table oncontextmenu='return false' onselectstart='return false' style='width:160;cursor:default;border:1 solid #9c9c9c;border-right:0;border-bottom:0;filter:progid:dximagetransform.microsoft.dropshadow(color=#e3e3e3,offx=3,offy=3,positive=true)' border='0' cellpadding='0' cellspacing='0'>/n"+
        "<tr><td colspan='7' class='TrOut'>"+
        "<table width='100%' height='100%'border='0' cellpadding='0' cellspacing='0'><tr align='center'>/n"+
        "<td width='20' style='font-family:/"webdings/";font-size:9pt' onclick='TableFunction().JumpToRun(/"b/")' onmouseover='this.style.color=/"#ff9900/"' onmouseout='this.style.color=/"/"'>3</td>/n"+
        "<td id='YearTD' width='70' onmouseover='this.style.background=/"#cccccc/"' onmouseout='this.style.background=/"/"' onclick='TableFunction().WriteSelect(this,this.innerText.split(/" /")[0],/"y/",false)'>"+y+" 年</td>/n"+
        "<td id='MonthTD' width='47' onmouseover='this.style.background=/"#cccccc/"' onmouseout='this.style.background=/"/"' onclick='TableFunction().WriteSelect(this,this.innerText.split(/" /")[0],/"m/",false)'>"+m+" 月</td>/n"+
        "<td width='20' style='font-family:/"webdings/";font-size:9pt' onclick='TableFunction().JumpToRun(/"n/")' onmouseover='this.style.color=/"#ff9900/"' onmouseout='this.style.color=/"/"'>4</td></tr></table>/n"+
        "</td></tr>/n"+
        "<tr align='center'>/n";
        for(var i=0;i<7;i++)
        this.DStr+="<td class='TrOut'>"+DateArray[i]+"</td>/n";
        this.DStr+="</tr>/n";
        for(var i=0;i<6;i++){
        this.DStr+="<tr align='center'>/n";
        for(var j=0;j<7;j++){
            var CS=new Date().getDate()==this.GetDateStr(y,m)[i*7+j]?"TdOver":"TdOut";
            this.DStr+="<td id='TD' class='"+CS+"' cs='"+CS+"' onmouseover='this.className=/"TdOver/"' onmouseout='if(this.cs!=/"TdOver/")this.className=/"TdOut/"' onclick='TableFunction().AlertDay()'>"+this.GetDateStr(y,m)[i*7+j]+"</td>/n";
            }
        this.DStr+="</tr>/n";
        }
        this.DStr+="</tabe>";
        return this.DStr;
        }
    this.WriteSelect=function(obj,values,action,getobj){
        if(values=="")return;
        if(getobj){
            obj.innerHTML=values+(action=="y"?" 年":" 月");
            this.RewriteTableStr(YearTD.innerText.split(" ")[0],MonthTD.innerText.split(" ")[0]);
            return false;
            }
        var StrArray=[];
        if(action=="y"){
            for(var i=0;i<15;i++){
                var year=values-7+i;
                StrArray[i]="<option value='"+year+"' "+(values==year?"selected":"")+"> "+year+"年</option>/n";
                }
            obj.innerHTML="<select id='select1' style='width:67' onchange='TableFunction().WriteSelect(parentElement,this.value,/"y/",true)' onblur='YearTD.innerText=this.value+/" 年/"'>/n"+StrArray.join("")+"</select>";
            select1.focus();
            }
        if(action=="m"){
            for(var i=1;i<13;i++)
                StrArray[i]="<option value='"+i+"' "+(i==values?"selected":"")+"> "+i+"月</option>/n";
            obj.innerHTML="<select id='select2' style='width:47' onchange='TableFunction().WriteSelect(parentElement,this.value,/"m/",true)' onblur='MonthTD.innerText=this.value+/" 月/"'>/n"+StrArray.join("")+"</select>";
            select2.focus();
            }
        }
    this.RewriteTableStr=function(y,m){
        var TArray=this.GetDateStr(y,m);
        var len=TArray.length;
        for(var i=0;i<len;i++){
            TD[i].innerHTML=TArray[i];
            TD[i].className="TdOut";
            TD[i].cs="TdOut";
            if(new Date().getYear()==y&&new Date().getMonth()+1==m&&new Date().getDate()==TArray[i]){
                TD[i].className="TdOver";
                TD[i].cs="TdOver";
                }
            }
        }
    this.JumpToRun=function(action){
        var YearNO=YearTD.innerText.split(' ')[0];
        var MonthNO=MonthTD.innerText.split(' ')[0];
        if(action=="b"){
            if(MonthNO=="1"){
                MonthNO=13;
                YearNO=YearNO-1;
                }
            MonthTD.innerText=MonthNO-1+" 月";
            YearTD.innerText=YearNO+" 年";
            this.RewriteTableStr(YearNO,MonthNO-1);
            }
        if(action=="n"){
            if(MonthNO=="12"){
                MonthNO=0;
                YearNO=YearNO-(-1);
                }
            YearTD.innerText=YearNO+" 年";
            MonthTD.innerText=MonthNO-(-1)+" 月";
            this.RewriteTableStr(YearNO,MonthNO-(-1));
            }
        }
    this.AlertDay=function(){
        if(event.srcElement.innerText!=" ")
        document.all('oText').value=YearTD.innerText.split(' ')[0]+"年"+MonthTD.innerText.split(' ')[0]+"月"+event.srcElement.innerText+"日";
        }
    return this;
    }
document.all('oDiv').innerHTML=TableFunction().GetTableStr(new Date().getYear(),new Date().getMonth()+1);
</Script>
<span style="border:1px solid menu;">
<input type="text" id="oText" onpropertychange="document.all('oDiv').style.display='none';" style="border:0px;width:140px;height:20px;" readonly><input type="button" style="font:12pt webdings;border:0px;width:18px;height:20px;cursor:hand;" value="6" onclick="document.all('oDiv').style.display='inline';" onfocus="blur();"></span>
<div id="oDiv" style="display:none;"></div>

 

用js实现的日历界面

  • 2013年08月01日 15:53
  • 32KB
  • 下载

C语言格式化输出日历(万年历)

C语言控制台输出日历。先输入年份,然后输入每行显示的月份个数。 如图: 代码如下: #include int main(void) { int a, i, j, n, k...
  • odaynot
  • odaynot
  • 2012年11月18日 18:47
  • 6519

js代码实现日历功能,超给力demo

  • 2013年06月17日 15:43
  • 12KB
  • 下载

VS2010/VS2012/MFC/日历/万年历/程式源码

写了一个万年历小程式。 使用VS 2010 MFC 基于对话框的程式。 万年历最主要的是要处理农历部份,农历的数据不能动态计算,必须编定好数据在程式里面。 首先写一个类处理日历中农历的数据部份,...

用java语言实现万年历(输入年月,打印当前日历,主要使用Java Swing技术)

先编写一个方法,它将格式为“yyyy/mm/dd”形式的日期字符串转化为日期对象。若日期字符串不符合以上规定,则抛出异常。再在main方法中对正常和异常输入的日期字符串分别进行验证,并输出转换后的日期...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:JS日历,(万年历)功能和界面都挺好的
举报原因:
原因补充:

(最多只允许输入30个字)