您的位置:首页 > Web前端 > JavaScript

一个小日历程序(js)

2008-08-29 17:54 435 查看


<script language="javascript" type="">
var now=new Date();
var yearNow=now.getYear();
var yearDisabled=yearNow;
var monthNow=now.getMonth();
var date=now.getDate();

function timeshow(){
var time=new Date();
var yy=time.getYear();
var mm=time.getMonth()+1;
var dd=time.getDate();
var h=time.getHours();
var m=time.getMinutes();
var s=time.getSeconds();
document.getElementById("time").innerText="TIME:"+yy+"-"+mm+"-"+dd+":"+h+":"+m+":"+s;
setTimeout("timeshow()",500);
}

function init(){
document.getElementById("showYear").innerText=yearNow;//显示当前年份
for(var i=1;i<=12;i++){//循环输出月份
var monthAdd=new Option(i,i);
document.getElementById("select").add(monthAdd);//为月份下拉列表赋值
}
document.getElementById("select").options.selected=true;//默认选择当前月份..monthNow 在这是从0开始
showDate();
timeshow();
}

function upNum(){//年份增加
yearNow++;
document.getElementById("showYear").innerText=yearNow;
showDate();
}

function downNum(){//年份减小
yearNow--;
document.getElementById("showYear").innerText=yearNow;
showDate();
}

function monthChange(){
showDate();
}
//
function showDate(){
var weeks=new Array("日","一","二","三","四","五","六");
var GetYear=document.getElementById("showYear").value;
var GetMonth=document.getElementById("select").value;
var then=new Date(); //新new一个日期对象
then.setYear(GetYear);
then.setMonth(GetMonth-1); //设置当前年份
then.setDate(1);//将日期设为本月的第一天
var weekOfFirstDay=then.getDay();
//var m1=then.getMonth();

then.setMonth(GetMonth);//重设月份
then.setDate(0);//将日期设为本月的最后一天
var weekOfLastDay=then.getDay();//获取最后一天的星期
var days=then.getDate();//获取该月的天数
//var m2=then.getMonth();
//alert(days);
//alert(weekOfFirstDay+" "+weekOfLastDay+" "+days+" "+GetYear+" "+GetMonth+" "+m1+" "+m2);

var StrDate="";//设置字符串以形成表格形式
StrDate+="<table width='200' border='1' cellspacing='0' cellpadding='0'>";
var nullCellNumBeforeFirstDay=weekOfFirstDay;//当用表格输出日期时第一天前所存在的空格数
var nullCellNumAfterLastDay=(6-weekOfLastDay);//最后一天后面存在的空格数
var tatalNum=days+nullCellNumBeforeFirstDay+nullCellNumAfterLastDay;//总空格数
var rows=tatalNum/7;//需要输出的行数

//以下方法未考虑用输出行来进行约束
StrDate+="<tr><td>日</td><td>一</td><td>二</td><td>三</td><td>四</td><td>五</td><td>六</td></tr>";
StrDate+="<tr>";
var count=0;
for(var dayRow=(-weekOfFirstDay+1);dayRow<=(days+nullCellNumAfterLastDay);dayRow++){//设计总共天数
count++;
if(dayRow<1){
StrDate+="<td> </td>";
}
else if(dayRow<=days){
if(dayRow==date && GetMonth==(monthNow+1) &&GetYear==yearDisabled){
StrDate+="<td bgcolor=#00FF00>"+dayRow+"</td>";
}else if(count==1||count==7){
StrDate+="<td bgcolor=#FF9900>"+dayRow+"</td>";
}
else{
StrDate+="<td>"+dayRow+"</td>";
}
}
else{
StrDate+="<td> </td>";
}
if(count==7&&dayRow<days){
count=0;
StrDate+="</tr>";
StrDate+="<tr>";
}else if(count==7&&dayRow>=days){
StrDate+="</tr>";
break;
}
}
document.getElementById("td").innerHTML=StrDate;
}

</script>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: