Vb教程 Vb.net教程 Vfp教程 C/C++教程 Vc/Vc++教程 Delphi教程 Java教程 Powerbuilder
  杀毒频道 | 短信频道 | 网络电视 | 论文中心 | 学上网 | 学软件 | 网页特效 | 电脑基础 | 论坛  
  NCRE | 软考 | CET | 职称英语 | 司法考试 | 报关员 | 公务员 | CATTI | CPA考试  
  Html教程 | Css教程 | Xml教程 | Asp教程 | Asp.net | Php教程 | Jsp教程 | Linux教程 | QQ技巧  
Photoshop Illustrator ImageReady Maya教程 3D Max教程 Lightscape Coredraw教程 Authorware Autocad教程 Freehand教程
Access教程 Mysql教程 Sql server Oracle教程 Word教程 Excel教程 Powerpoint Frontpage Asp.net源码 Php源代码
Flash教程 Fireworks Dreamweaver C#教程 outlook教程 系统安装 vbscript教程 Javascript Jsp源代码 Asp源代码
您的位置:首页 >> javascript教程 >> 正文

一个js作的日历

文章来源:互联网

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>日历</title>
<style type="text/css">
<!--
body { font-size: 9pt}
table { font-size: 9pt}
a { text-decoration: none}
-->
</style>
<script language="JavaScript">
<!--
var Selected_Month;
var Selected_Year;
var Current_Date = new Date();
var Current_Month = Current_Date.getMonth();

var Days_in_Month = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
var Month_Label = new Array('一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月');

var Current_Year = Current_Date.getYear();

var Today = Current_Date.getDate();

function Header(Year, Month) {

if (Month == 1) {
if ((Year % 400 == 0) || ((Year % 4 == 0) && (Year % 100 != 0))) {
Days_in_Month[1] = 29;
}
}
var Header_String = Year + '年' + Month_Label[Month];
return Header_String;
}



function Make_Calendar(Year, Month) {
var First_Date = new Date(Year, Month, 1);
var Heading = Header(Year, Month);
var First_Day = First_Date.getDay() + 1;
if (((Days_in_Month[Month] == 31) && (First_Day >= 6)) ||
((Days_in_Month[Month] == 30) && (First_Day == 7))) {
var Rows = 6;
}
else if ((Days_in_Month[Month] == 28) && (First_Day == 1)) {
var Rows = 4;
}
else {
var Rows = 5;
}

var HTML_String = '<table><tr><td valign="top"><table BORDER=2 CELLSPACING=1 cellpadding=2 FRAME="box" BGCOLOR="C0C0C0" BORDERCOLORLIGHT="808080">';

HTML_String += '<tr><th colspan=7 BGCOLOR="FFFFFF" BORDERCOLOR="000000">' + Heading + '</font></th></tr>';

HTML_String += '<tr><th ALIGN="CENTER" BGCOLOR="FFFFFF" BORDERCOLOR="000000">日</th><th ALIGN="CENTER" BGCOLOR="FFFFFF" BORDERCOLOR="000000">一</th><th ALIGN="CENTER" BGCOLOR="FFFFFF" BORDERCOLOR="000000">二</th><th ALIGN="CENTER" BGCOLOR="FFFFFF" BORDERCOLOR="000000">三</th>';

HTML_String += '<th ALIGN="CENTER" BGCOLOR="FFFFFF" BORDERCOLOR="000000">四</th><th ALIGN="CENTER" BGCOLOR="FFFFFF" BORDERCOLOR="000000">五</th><th ALIGN="CENTER" BGCOLOR="FFFFFF" BORDERCOLOR="000000">六</th></tr>';

var Day_Counter = 1;
var Loop_Counter = 1;
for (var j = 1; j <= Rows; j++) {
HTML_String += '<tr ALIGN="left" VALIGN="top">';
for (var i = 1; i < 8; i++) {
if ((Loop_Counter >= First_Day) && (Day_Counter <= Days_in_Month[Month])) {
if ((Day_Counter == Today) && (Year == Current_Year) && (Month == Current_Month)) {
HTML_String += '<td BGCOLOR="FFFFFF" BORDERCOLOR="000000"><strong><font color="red">' + Day_Counter + '</font></strong></td>';
}
else {
HTML_String += '<td BGCOLOR="FFFFFF" BORDERCOLOR="000000">' + Day_Counter + '</td>';
}
Day_Counter++;
}
else {
HTML_String += '<td BORDERCOLOR="C0C0C0"> </td>';
}
Loop_Counter++;
}
HTML_String += '</tr>';
}
HTML_String += '</table></td></tr></table>';
document.all.Calendar.innerHTML = HTML_String;
}


function Check_Nums() {
if ((event.keyCode < 48) || (event.keyCode > 57)) {
return false;
}
}



function On_Year() {
var Year = document.when.year.value;
if (Year.length == 4) {
Selected_Month = document.when.month.selectedIndex;
Selected_Year = Year;
Make_Calendar(Selected_Year, Selected_Month);
}
}

function On_Month() {
var Year = document.when.year.value;
if (Year.length == 4) {
Selected_Month = document.when.month.selectedIndex;
Selected_Year = Year;
Make_Calendar(Selected_Year, Selected_Month);
}
else {
alert('Please enter a valid year.');
document.when.year.focus();
}
}


function Defaults() {
if (!document.all)
return
var Mid_Screen = Math.round(document.body.clientWidth / 2);
document.when.month.selectedIndex = Current_Month;
document.when.year.value = Current_Year;
Selected_Month = Current_Month;
Selected_Year = Current_Year;
Make_Calendar(Current_Year, Current_Month);
}


function Skip(Direction) {
if (Direction == '+') {
if (Selected_Month == 11) {
Selected_Month = 0;
Selected_Year++;
}
else {
Selected_Month++;
}
}
else {
if (Selected_Month == 0) {
Selected_Month = 11;
Selected_Year--;
}
else {
Selected_Month--;
}
}
Make_Calendar(Selected_Year, Selected_Month);
document.when.month.selectedIndex = Selected_Month;
document.when.year.value = Selected_Year;
}

function tick() {
var hours, minutes, seconds, xfile;
var intHours, intMinutes, intSeconds;
var today;
today = new Date();
intHours = today.getHours();
intMinutes = today.getMinutes();
intSeconds = today.getSeconds();
if (intHours == 0) {
hours = "12:";
xfile = "午夜 ";
} else if (intHours < 12) {
hours = intHours+":";
xfile = "上午 ";
} else if (intHours == 12) {
hours = "12:";
xfile = "正午 ";
} else {
intHours = intHours - 12
hours = intHours + ":";
xfile = "下午 ";
}
if (intMinutes < 10) {
minutes = "0"+intMinutes+":";
} else {
minutes = intMinutes+":";
}
if (intSeconds < 10) {
seconds = "0"+intSeconds+" ";
} else {
seconds = intSeconds+" ";
}
timeString = xfile+hours+minutes+seconds;
document.all.Clock.innerHTML = timeString;
window.setTimeout("tick();", 100);
}

//-->
</script>
</head>

<body onLoad="Defaults();tick()">
<table width="170" border="1" cellspacing="0" cellpadding="0">
<form name="when">
<tr>
<td align="center">
<div id=NavBar style="position:relative;top:-1px;">

<select name="month" onChange="On_Month()">
<script language="JavaScript1.2">
<!--
if (document.all){
for (j=0;j<Month_Label.length;j++) {
document.writeln('<option value=' + j + '>' + Month_Label[j]);
}
}
//-->
</script>
</select>
<input type="text" name="year" size=4 maxlength=4 onKeyPress="return Check_Nums()" onKeyUp="On_Year()"><br>
<div id="Clock" style="position:relative;top:-2px;"></div>
</div>
<div id=Calendar style="position:relative;top:-3px;"></div>
<input type="button" value=" 上月 " onClick="Skip('-')">
<input type="button" value=" 下月 " onClick="Skip('+')">
</td>
</tr>
</form>
</table>
</body>
</html>
//由于笔者时间上的缘故所有效果的预览交由读者自己放入网页查试,谢谢.

[返回]

编程语言 web开发 数据库 网络技术 操作系统 服务器 网页设计 图形设计 办公软件 常用软件 学电脑

Copyright© www.bianceng.cn Powered by 编程入门网 All Rights Reserved.
关于本站 | 版权声明 | 联系我们 | 友情链接 |
编程入门网 版权所有