|字號 訂閱
a.js
/*
* 機 能 :日歷
* 制作日期 :2009/05/25
* 制 作 人 :Good fun
* 版 本 :version 1.0
*/
//文本框輸出的年
var syear;
//文本框輸出的月
var smonth;
//文本框輸出的日 開(kāi)始時(shí)候為1
var sday=1;
/**
* 機 能:對輸入的日期進(jìn)行格式化判斷如(2008/5/3)如果不是這種格式 則報錯 否則將輸入日期返回
*/
function dateFormat(date) {
var dateformat = new RegExp(
"^[1-9][0-9]{3}/(([0][1-9])|([1][0-2])|[1-9])/(([0-2][0-9])|([3][0-1])|[1-9])$");
if (!dateformat.test(date)) {
alert("The date format you have entered is not correct!");
document.getElementById("dateinput").value = "";
}else{
return date;
}
}
/*
* 機 能:輸入一個(gè)日期 返回該日期是星期幾
*/
function getWeek(year, month, day) {
//month 因為Date月份是0-11 所有減1
var date = new Date(year, month - 1, day);
var weekday = date.getDay();
return (weekday);
}
/*
* 機 能:輸入一個(gè)日期 返回該日期的月份有多少天
*/
function getMonthDays(year, month) {
var mondays = 0;
if (month == 2) {
//判斷該年是否為暈年
if (year % 4 == 0 && (year % 400 != 0)) {
mondays = 29;
} else {
mondays = 28;
}
} else {
if (month == 4 || month == 6 || month == 9 || month == 11) {
mondays = 30;
} else {
mondays = 31;
}
}
return mondays;
}
/*
* 機 能:當日期改變 重新輸出日歷
*/
function on
var str = "";
//WNum接收輸入年月的第一天是星期幾,前面用空格代替
var WNum = getWeek(year, month, 1);
for (j = 0; j < WNum; j++) {
str += "<div></div>";
}
//MNum接收該年該月總共有多少天
var MNum = getMonthDays(year, month);
//輸出該月的每一天
for (j = 1; j <= MNum; j++) {
var TNum = getWeek(year, month, j);
//如果該天為星期天或星期六 該文本字體用紅色 否則用黑色
if (TNum == 0 || TNum == 6) {
var id = j;
str += "<div id = " + j+'s' + " style='color:#F00' on
+ j + "</div>";
} else {
str += "<div id = " + j+'s' + " style='color:#00F' on
+ j + "</div>";
}
}
//找出該月的最后一天
var EndNum = j - 1;
//如果最后一天不是星期六 則用空格代替
var EndWeekNum = getWeek(year, month, EndNum);
for (j = EndWeekNum; j < 6; j++) {
str += "<div></div>";
}
//在頁(yè)面輸出以上的元素
document.getElementById("td1").innerHTML = str;
//在輸出文本框里面輸出選中的日期
syear=document.getElementById("YearSel").value
smonth=document.getElementById("MonthSel").value
sdate=syear+"/"+smonth+"/"+sday;
document.getElementById("outDate").value=sdate;
var today = new Date();
var thisday = today.getDate();
sday=thisday;
//默認選中該月的今天的號的背景顏色設置為黃色
document.getElementById(thisday+"s").style.background='yellow';
// alert(dateEE);
// if(document.getElementById("dateinput").value!=null){
// //var ssday = dateEE.getDate();
//var dateEE = document.getElementById("dateinput").value ;
//var ary = dateEE.split("/");
//var ssday = ary[2];
//alert(ssday);
//document.getElementById(ssday+"s").style.background='yellow';
//document.getElementById("dateinput").value = "";
// }else{
//alert("llll");
// }
}
//在輸出文本框里面輸出選擇的日期
function setDate(obj) {
//先將該文本框清空
document.getElementById("outDate").value="";
syear=document.getElementById("YearSel").value
smonth=document.getElementById("MonthSel").value
sday=event.srcElement.innerText;
sdate=syear+"/"+smonth+"/"+sday;
document.getElementById("outDate").value=sdate;
}
//當鼠標進(jìn)入該區域時(shí),將該區域的背景顏色改變
function setColor(obj) {
bgColor = "#FFCCCC";
obj.style.background='#FFCCCC';
}
//當鼠標離開(kāi)該區域時(shí),將該區域的背景顏色改變
function setColoro(obj) {
bgColor = "#FFCCCC";
obj.style.background='white';
}
/*
* 機 能:在輸入文本框里面輸入一個(gè)日期時(shí)候 ,輸出日歷 ,并在輸出文本框輸出輸入的日期
*/
function setDates(){
//獲得輸入的日期
var date = document.getElementById("dateinput").value;
//對輸入日期進(jìn)行格式化判斷
var tdate = dateFormat(date);
//把輸入日期以“/”分成年,月,日三個(gè)字符串
var ary = tdate.split("/");
//輸出日歷
on
syear = ary[0];
smonth = ary[1];
sday = ary[2];
ssmonth=ary[1]
//對數入的月份進(jìn)行判斷如08則將8取出
if(ary[1].length == 2 && ary[1].charAt(0) == 0){
ssmonth=ary[1].charAt(1);
}
//將年份寫(xiě)回到年下拉列表的中
document.getElementById("YearSel").value = ary[0];
var today = new Date();
var thisday = today.getDate();
//默認選中該月的今天的號的背景顏色設置為黃色
document.getElementById(thisday+"s").style.background='white';
document.getElementById(ary[2]+"s").style.background='yellow';
//將月份寫(xiě)回到月下拉列表中
document.getElementById("MonthSel").value = ssmonth;
//在輸出文本框中輸出輸入的日期
sdate = syear + "/" + smonth + "/" + sday;
document.getElementById("outDate").value = sdate;
//document.getElementById("dateinput").value="";
}
下面是HTML Calendor.html
<html>
<head>
<title></title>
<style type="text/css">
<!--
.font1{ font-family:"宋體"; font-size:12px; line-height:23px;}
.font1 div{ list-style-type:none; float:left; height:23px; width:43px; border-top:1px solid #000000; border-left:1px solid #000000; text-align:center;}
-->
</style>
<script language="javas
</head>
<body>
<table align="center">
<tr>
<td>YYYY/MM/DD:<input type="text" id="dateinput" value=""/><input type="button" id="buttons" value="submit" on
<tr>
<td>
<div class="font1" ALIGN="center" style="width:302px; height:24px; border:1px solid #000; border-bottom:0;"><select name="YearSel" id="YearSel" on
<script language="javas
for(i=1950;i<=1950+200;i++)
{
var DateObj=new Date();
var YearNum=DateObj.getYear();
if(i==YearNum)
document.write("<option value='"+i+"' selected>"+i+"</option>");
else
document.write("<option value='"+i+"'>"+i+"</option>");
}
</script>
</select>
年
<select name="MonthSel" id="MonthSel" on
<script language="javas
for(i=1;i<=12;i++)
{
var DateObj1=new Date();
var MonthNum=DateObj1.getMonth()+1;
if(i==MonthNum)
document.write("<option value='"+i+"' selected>"+i+"</option>");
else
document.write("<option value='"+i+"'>"+i+"</option>");
}
</script>
</select>
月
</div>
<div class="font1" style="height:24px; width:302px; border-right:1px solid #000;">
<div style="color:#F00;" id="hello" value="日" on
<div>一</div>
<div>二</div>
<div>三</div>
<div>四</div>
<div>五</div>
<div style="color:#F00;">六</div>
</div>
<div id="td1" class="font1" style=" width:302px; margin-right:auto; margin-right:auto; height:2px;border-bottom:1px solid #000; background:#FFF; border-right:1px solid #000;">
<script language="javas
var d = new Date();
var ThisYear=d.getYear();
var ThisMonth=d.getMonth()+1;
var TheDay=1
var WNum=getWeek(ThisYear,ThisMonth,TheDay);
for(j=0;j<WNum;j++)
{
document.write("<div></div>");
}
var MNum=getMonthDays(ThisYear,ThisMonth);
for(j=1;j<=MNum;j++)
{
var TNum=getWeek(ThisYear,ThisMonth,j);
if(TNum==0 || TNum==6)
{
document.write("<div id = " + j+'s' + " style='color:#F00' on
}
else
{
document.write("<div id = " + j+'s' + " style='color:#00F'on
}
}
var EndNum=j-1;
var EndWeekNum=getWeek(ThisYear,ThisMonth,EndNum);
for(j=EndWeekNum;j<6;j++)
{
document.write("<div></div>");
}
var today = new Date();
var thisday = today.getDate();
document.getElementById(thisday+"s").style.background = 'yellow';
</script>
</div>
</td>
</tr>
<tr><td>Choosed Date :<input type="text" id="outDate" value="" enabled="disabled"></td></tr>
</table>
</body>
</html>
日歷表制作源代碼-----------------------------------------------------------------------------------------------------------------------
<SCRIPT language=JavaScript>
function Year_Month(){
var now = new Date();
var yy = now.getYear();
var mm = now.getMonth()+1;
var cl = '<font color="#0000df">';
if (now.getDay() == 0) cl = '<font color="#c00000">';
if (now.getDay() == 6) cl = '<font color="#00c000">';
return(cl + yy + '年' + mm + '月</font>'); }
function Date_of_Today(){
var now = new Date();
var cl = '<font color="#ff0000">';
if (now.getDay() == 0) cl = '<font color="#c00000">';
if (now.getDay() == 6) cl = '<font color="#00c000">';
return(cl + now.getDate() + '</font>'); }
function Day_of_Today(){
var day = new Array();
day[0] = "星期日";
day[1] = "星期一";
day[2] = "星期二";
day[3] = "星期三";
day[4] = "星期四";
day[5] = "星期五";
day[6] = "星期六";
var now = new Date();
var cl = '<font color="#0000df">';
if (now.getDay() == 0) cl = '<font color="#c00000">';
if (now.getDay() == 6) cl = '<font color="#00c000">';
return(cl + day[now.getDay()] + '</font>'); }
function CurentTime(){
var now = new Date();
var hh = now.getHours();
var mm = now.getMinutes();
var ss = now.getTime() % 60000;
ss = (ss - (ss % 1000)) / 1000;
var clock = hh+':';
if (mm < 10) clock += '0';
clock += mm+':';
if (ss < 10) clock += '0';
clock += ss;
return(clock); }
function refreshCalendarClock(){
document.all.calendarClock1.innerHTML = Year_Month();
document.all.calendarClock2.innerHTML = Date_of_Today();
document.all.calendarClock3.innerHTML = Day_of_Today();
document.all.calendarClock4.innerHTML = CurentTime(); }
var webUrl = webUrl;
document.write('<table border="0" cellpadding="0" cellspacing="0"><tr><td>');
document.write('<table id="CalendarClockFreeCode" border="0" cellpadding="0" cellspacing="0" width="60" height="70" ');
document.write('style="position:absolute;visibility:hidden" bgcolor="#eeeeee">');
document.write('<tr><td align="center"><font ');
document.write('style="cursor:hand;color:#ff0000;font-family:宋體;font-size:14pt;line-height:120%" ');
if (webUrl != 'netflower'){
document.write('</td></tr><tr><td align="center"><font ');
document.write('style="cursor:hand;color:#2000ff;font-family:宋體;font-size:9pt;line-height:110%" ');
}
document.write('</td></tr></table>');
document.write('<table border="0" cellpadding="0" cellspacing="0" width="61" bgcolor="#C0C0C0" height="70">');
document.write('<tr><td valign="top" width="100%" height="100%">');
document.write('<table border="1" cellpadding="0" cellspacing="0" width="58" bgcolor="#FEFEEF" height="67">');
document.write('<tr><td align="center" width="100%" height="100%" >');
document.write('<font id="calendarClock1" style="font-family:宋體;font-size:7pt;line-height:120%"> </font><br>');
document.write('<font id="calendarClock2" style="color:#ff0000;font-family:Arial;font-size:14pt;line-height:120%"> </font><br>');
document.write('<font id="calendarClock3" style="font-family:宋體;font-size:9pt;line-height:120%"> </font><br>');
document.write('<font id="calendarClock4" style="color:#100080;font-family:宋體;font-size:8pt;line-height:120%"><b> </b></font>');
document.write('</td></tr></table>');
document.write('</td></tr></table>');
document.write('</td></tr></table>');
setInterval('refreshCalendarClock()',1000);
</SCRIPT>
聯(lián)系客服