由Javascript實現的頁面日歷_時間日期
來源:懂視網
責編:小采
時間:2020-11-27 21:01:21
由Javascript實現的頁面日歷_時間日期
由Javascript實現的頁面日歷_時間日期:效果圖:CSS代碼: 代碼如下: *{ margin:0; padding:0; font:10px tahoma; } #calender{ text-align:center; width:147px; font-size:10px; /*color: #27B0C1;*/ margin:12px 0 12px 6px; border-t
導讀由Javascript實現的頁面日歷_時間日期:效果圖:CSS代碼: 代碼如下: *{ margin:0; padding:0; font:10px tahoma; } #calender{ text-align:center; width:147px; font-size:10px; /*color: #27B0C1;*/ margin:12px 0 12px 6px; border-t

效果圖:

CSS代碼:
代碼如下:
腳本代碼:
代碼如下:
輸出日歷===========
var str;
str = "
";
str += "" str += changecal("preyear",d_year,d_month) str += changecal("premonth",d_year,d_month) str += d_year + " - " + (d_month*1+1) str += changecal("nextmonth",d_year,d_month) str += changecal("nextyear",d_year,d_month) str += " |
";
str += "Su | Mo | Tu | We | Th | Fr | Sa |
";
str += "";
var firstday,lastday,totalcounts,firstspace,lastspace,monthdays;
//需要顯示的月份共有幾天,可以用已定義的數組來獲取
monthdays = monthdates[d.getMonth()];
//設定日期為月份中的第一天
d.setDate(1);
//需要顯示的月份的第一天是星期幾
firstday = d.getDay();
//1號前面需要補足的的空單元格的數
firstspace = firstday;
//設定日期為月份的最后一天
d.setDate(monthdays);
//需要顯示的月份的最后一天是星期幾
lastday = d.getDay();
//最后一天后面需要空單元格數
lastspace = 6 - lastday;
//前空單元格+總天數+后空單元格,用來控制循環
totalcounts = firstspace*1 + monthdays*1 + lastspace*1;
//count:大循環的變量;f_space:輸出前空單元格的循環變量;l_space:用于輸出后空單元格的循環變量
var count,flag,f_space,l_space;
//flag:前空單元格輸完后令flag=1不再繼續做這個小循環
flag = 0;
for(count=1;count<=totalcounts;count++)
{
//一開始flag=0,首先輸出前空單元格,輸完以后flag=1,以后將不再執行這個循環
if(flag==0)
{
if(firstspace!=0)
{
for(f_space=1;f_space<=firstspace;f_space++)
{
str += " | ";
if(f_space!= firstspace) count++;
}
flag = 1;
continue;
}
}
if((count-firstspace)<=monthdays)
{
//輸出月份中的所有天數
curday = d_year+","+(d_month*1+1)+","+(count - firstspace)+"|"
linkday = d_year+","+(d_month*1+1)+","+(count - firstspace)
var today = new Date();
if( (d_year == today.getYear()) && (d_month == today.getMonth()) && ((count-firstspace) == today.getDate()) )
{
//將本地系統中的當前天數高亮
str += "" + (count - firstspace) + " | ";
}else{
//不用高亮的部分,沒有日志
str += "" + (count - firstspace) + " | ";
}
if(count%7==0)
{
if(count{
str += "
";
}else{
str += "
";
}
}
}else{
//如果已經輸出了月份中的最后一天,就開始輸出后空單元格補足
for(l_space=1;l_space<=lastspace;l_space++)
{
str += " | ";
if(l_space!= lastspace) count++;
}
continue;
}
}
str += "www.sugood.cn |
"
document.getElementById("calenderdiv").innerHTML = "" + str + "";
}
//調用函數
calender("","")
//-->
script>
聲明:本網頁內容旨在傳播知識,若有侵權等問題請及時與本網聯系,我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com
由Javascript實現的頁面日歷_時間日期
由Javascript實現的頁面日歷_時間日期:效果圖:CSS代碼: 代碼如下: *{ margin:0; padding:0; font:10px tahoma; } #calender{ text-align:center; width:147px; font-size:10px; /*color: #27B0C1;*/ margin:12px 0 12px 6px; border-t