包含html时间日历代码的词条
华为云服务器特价优惠火热进行中！ 2核2G2兆仅需 38 元；4核4G3兆仅需 79 元。购买时间越长越优惠！更多配置及优惠价格请咨询客服。
合作流程： |
本篇文章给大家谈谈html时间日历代码，以及对应的知识点，希望对各位有所帮助，不要忘了收藏本站喔。
微信号：cloud7591如需了解更多，欢迎添加客服微信咨询。
复制微信号
本文目录一览：
- 1、html静态页面怎么实现动态时间日历
- 2、javascript html实现网页版日历代码
- 3、html怎么写这个日历
- 4、求时间日期html代码，带农历！（高手进）
- 5、谁能给一段点击之后出现日历的代码
html静态页面怎么实现动态时间日历
script language=Javascript
var now=new Date()
document.write("现在是"+now.getYear()+"年"+(now.getMonth()+1)+"月"+now.getDate()+"日"+now.getHours()+"时"+now.getMinutes()+"分"+now.getSeconds()+"秒")
/script
javascript html实现网页版日历代码
本文实例为大家分享了网页版日历代码，供大家参考，具体内容如下
效果图：
实现代码：
html
head
link
rel="stylesheet"
type="text/css"
href="Skin.css"
style
!--
table{
text-align:
center
}
--
/style
/head
body
div
align="center"
script
language="javascript"
var
my
=
new
Date();
function
showc()
{
var
k=1;
var
j=1;
var
today;
var
tomonth;
var
theday=1;//日期
var
max;
var
temp;
var
tempday;//这个月第一天的星期
document.write
("b"
+
my.getFullYear()
+
"-"
+
(my.getMonth()+1)
+
"/b");
document.write
("table
border='1'
width='273'
height='158'");
document.write
("tr");
document.write
("td
height='23'
width='39'font
color='red'Sun/font/td");
document.write
("td
height='23'
width='39'Mon/td");
document.write
("td
height='23'
width='39'Tue/td");
document.write
("td
height='23'
width='39'Wed/td");
document.write
("td
height='23'
width='39'Thu/td");
document.write
("td
height='23'
width='39'Fri/td");
document.write
("td
height='23'
width='39'Sat/td");
document.write
("/tr");
temp=my.getDate();
my.setDate(1);
//document.write
(my.getDate());
tempday=my.getDay();//返回第一天是星期几
my.setDate(temp);
today=my.getDay();//返回现在星期几
switch
((my.getMonth()+1))
{
case
1:
case
3:
case
5:
case
7:
case
8:
case
10:
case
12:
max=31;
break;
case
4:
case
6:
case
9:
case
11:
max=30;
break;
default:
max=29;//这里没有考虑闰月！！
//document.write
(max);
}
for(k=0;k6;k++)
{
document.write
("tr");
for(j=0;j=6;j++)
{
document.write
("td
height='23'
width='39'");
if(j=(tempday))
{
tempday=0;//设置为最小，相当于取消判断条件
if(theday=max)
{
document.write
("a
title="
+
my.getFullYear()
+
"-"
+
(my.getMonth()+1)
+
"-"
+theday
+
"
target='_blank'
href=detail.asp?date="
+
theday
+
"");
if(theday==my.getDate())
document.write
("font
color='green'["
+
theday
+
"]/font/a");
else
if(j==0)
document.write
("font
color='red'"
+
theday
+
"/font/a");
else
document.write
(theday
+
"/a");
theday++;
}
}
document.write
("/td");
}
document.write
("/tr");
}
document.write
("/table");
}
showc();
/script
/div
body
/html
以上就是本文的全部内容，希望大家可以轻松实现网页版日历。
html怎么写这个日历
!DOCTYPE html
html lang="en"
head
meta charset="UTF-8"
title/title
style
table {
width: 230px;
margin: auto;
text-align: center;
border: 1px solid darkcyan;
border-bottom: 3px double darkcyan;
box-shadow: 0 1px 2px darkcyan;
}
th,
td {
border: 1px solid darkcyan;
}
.today {
color: red;
}
/style
script
//判断当前年份是否是闰年(闰年2月份有29天，平年2月份只有28天)
function isLeap(year) {
return year % 4 == 0 ? (year % 100 != 0 ? 1 : (year % 400 == 0 ? 1 : 0)) : 0;
}
var i, k,
today = new Date(), //获取当前日期
y = today.getFullYear(), //获取日期中的年份
m = today.getMonth(), //获取日期中的月份(需要注意的是：月份是从0开始计算，获取的值比正常月份的值少1)
d = today.getDate(), //获取日期中的日(方便在建立日期表格时高亮显示当天)
firstday = new Date(y, m, 1), //获取当月的第一天
dayOfWeek = firstday.getDay(), //判断第一天是星期几(返回[0-6]中的一个，0代表星期天，1代表星期一，以此类推)
days_per_month = new Array(31, 28 + isLeap(y), 31, 30, 31, 30, 31, 31, 30, 31, 30, 31), //创建月份数组
str_nums = Math.ceil((dayOfWeek + days_per_month[m]) / 7); //确定日期表格所需的行数
document.write("table cellspacing='0'trtd colspan ='7'" + y + "年" + (m + 1) + "月" + "/td/tr");
document.write("trth日/thth一/thth二/thth三/thth四/thth五/thth六/th/tr"); //打印表格第一行(显示星期)
for(i = 0; i str_nums; i += 1) { //二维数组创建日期表格
document.write('tr');
for(k = 0; k 7; k++) {
var idx = 7 * i + k; //为每个表格创建索引,从0开始
var date = idx - dayOfWeek + 1; //将当月的1号与星期进行匹配
(date = 0 || date days_per_month[m]) ? date = ' ': date = idx - dayOfWeek + 1; //索引小于等于0或者大于月份最大值就用空表格代替
date == d ? document.write('td class="today"' + date + '/td') : document.write('td' + date + '/td'); //高亮显示当天
}
document.write('/tr');
}
document.write('/table');
/script
/head
body
/body
/html
求时间日期html代码，带农历！（高手进）
下面代码可以实现你要的功能，如下。至于你看不到它的真实的源代码，它可能通过程序动态加载，或者是js调用。你看到的，仅仅是静态的html代码而已！
html
head
meta http-equiv="Content-Type" content="text/html; charset=gb2312"
title单行带农历的日期时间代码/title
/head
body
SCRIPT language=JavaScript
!--
function CalConv()
{
FIRSTYEAR = 1998;
LASTYEAR = 2031;
today = new Date();
SolarYear = today.getFullYear();
SolarMonth = today.getMonth() + 1;
SolarDate = today.getDate();
Weekday = today.getDay();
LunarCal = [
new tagLunarCal( 27, 5, 3, 43, 1, 0, 0, 1, 0, 0, 1, 1, 0, 1, 1, 0, 1 ),
new tagLunarCal( 46, 0, 4, 48, 1, 0, 0, 1, 0, 0, 1, 0, 1, 1, 1, 0, 1 ),
new tagLunarCal( 35, 0, 5, 53, 1, 1, 0, 0, 1, 0, 0, 1, 0, 1, 1, 0, 1 ),
new tagLunarCal( 23, 4, 0, 59, 1, 1, 0, 1, 0, 1, 0, 0, 1, 0, 1, 0, 1 ),
new tagLunarCal( 42, 0, 1, 4, 1, 1, 0, 1, 0, 1, 0, 0, 1, 0, 1, 0, 1 ),
new tagLunarCal( 31, 0, 2, 9, 1, 1, 0, 1, 1, 0, 1, 0, 0, 1, 0, 1, 0 ),
new tagLunarCal( 21, 2, 3, 14, 0, 1, 0, 1, 1, 0, 1, 0, 1, 0, 1, 0, 1 ),
new tagLunarCal( 39, 0, 5, 20, 0, 1, 0, 1, 0, 1, 1, 0, 1, 0, 1, 0, 1 ),
new tagLunarCal( 28, 7, 6, 25, 1, 0, 1, 0, 1, 0, 1, 0, 1, 1, 0, 1, 1 ),
new tagLunarCal( 48, 0, 0, 30, 0, 0, 1, 0, 0, 1, 0, 1, 1, 1, 0, 1, 1 ),
new tagLunarCal( 37, 0, 1, 35, 1, 0, 0, 1, 0, 0, 1, 0, 1, 1, 0, 1, 1 ),
new tagLunarCal( 25, 5, 3, 41, 1, 1, 0, 0, 1, 0, 0, 1, 0, 1, 0, 1, 1 ),
new tagLunarCal( 44, 0, 4, 46, 1, 0, 1, 0, 1, 0, 0, 1, 0, 1, 0, 1, 1 ),
new tagLunarCal( 33, 0, 5, 51, 1, 0, 1, 1, 0, 1, 0, 0, 1, 0, 1, 0, 1 ),
new tagLunarCal( 22, 4, 6, 56, 1, 0, 1, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0 ),
new tagLunarCal( 40, 0, 1, 2, 1, 0, 1, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0 ),
new tagLunarCal( 30, 9, 2, 7, 0, 1, 0, 1, 0, 1, 0, 1, 1, 0, 1, 0, 1 ),
new tagLunarCal( 49, 0, 3, 12, 0, 1, 0, 0, 1, 0, 1, 1, 1, 0, 1, 0, 1 ),
new tagLunarCal( 38, 0, 4, 17, 1, 0, 1, 0, 0, 1, 0, 1, 1, 0, 1, 1, 0 ),
new tagLunarCal( 27, 6, 6, 23, 0, 1, 0, 1, 0, 0, 1, 0, 1, 0, 1, 1, 1 ),
new tagLunarCal( 46, 0, 0, 28, 0, 1, 0, 1, 0, 0, 1, 0, 1, 0, 1, 1, 0 ),
new tagLunarCal( 35, 0, 1, 33, 0, 1, 1, 0, 1, 0, 0, 1, 0, 0, 1, 1, 0 ),
new tagLunarCal( 24, 4, 2, 38, 0, 1, 1, 1, 0, 1, 0, 0, 1, 0, 1, 0, 1 ),
new tagLunarCal( 42, 0, 4, 44, 0, 1, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1 ),
new tagLunarCal( 31, 0, 5, 49, 1, 0, 1, 0, 1, 1, 0, 1, 0, 1, 0, 1, 0 ),
new tagLunarCal( 21, 2, 6, 54, 0, 1, 0, 1, 0, 1, 0, 1, 1, 0, 1, 0, 1 ),
new tagLunarCal( 40, 0, 0, 59, 0, 1, 0, 0, 1, 0, 1, 1, 0, 1, 1, 0, 1 ),
new tagLunarCal( 28, 6, 2, 5, 1, 0, 1, 0, 0, 1, 0, 1, 0, 1, 1, 1, 0 ),
new tagLunarCal( 47, 0, 3, 10, 1, 0, 1, 0, 0, 1, 0, 0, 1, 1, 1, 0, 1 ),
new tagLunarCal( 36, 0, 4, 15, 1, 1, 0, 1, 0, 0, 1, 0, 0, 1, 1, 0, 1 ),
new tagLunarCal( 25, 5, 5, 20, 1, 1, 1, 0, 1, 0, 0, 1, 0, 0, 1, 1, 0 ),
new tagLunarCal( 43, 0, 0, 26, 1, 1, 0, 1, 0, 1, 0, 1, 0, 0, 1, 0, 1 ),
new tagLunarCal( 32, 0, 1, 31, 1, 1, 0, 1, 1, 0, 1, 0, 1, 0, 1, 0, 0 ),
new tagLunarCal( 22, 3, 2, 36, 0, 1, 1, 0, 1, 0, 1, 1, 0, 1, 0, 1, 0 ) ];
SolarCal = [ 31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31 ];
SolarDays = [ 0, 31, 59, 90, 120, 151, 181, 212, 243, 273, 304, 334, 365, 396, 0, 31, 60, 91, 121, 152, 182, 213, 244, 274, 305, 335, 366, 397 ];
if ( SolarYear = FIRSTYEAR || SolarYear LASTYEAR ) return 1;
sm = SolarMonth - 1;
if ( sm 0 || sm 11 ) return 2;
leap = GetLeap( SolarYear );
if ( sm == 1 )
d = leap + 28;
else
d = SolarCal[sm];
if ( SolarDate 1 || SolarDate d ) return 3;
y = SolarYear - FIRSTYEAR;
acc = SolarDays[ leap*14 + sm ] + SolarDate;
kc = acc + LunarCal[y].BaseKanChih;
Kan = kc % 10;
Chih = kc % 12;
Age = kc % 60;
if ( Age 22 )
Age = 22 - Age;
else
Age = 82 - Age;
if ( acc = LunarCal[y].BaseDays ) {
y--;
LunarYear = SolarYear - 1;
leap = GetLeap( LunarYear );
sm += 12;
acc = SolarDays[leap*14 + sm] + SolarDate;
}
else
LunarYear = SolarYear;
l1 = LunarCal[y].BaseDays;
for ( i=0; i13; i++ ) {
l2 = l1 + LunarCal[y].MonthDays[i] + 29;
if ( acc = l2 ) break;
l1 = l2;
}
LunarMonth = i + 1;
LunarDate = acc - l1;
im = LunarCal[y].Intercalation;
if ( im != 0 LunarMonth im ) {
LunarMonth--;
if ( LunarMonth == im ) LunarMonth = -im;
}
if ( LunarMonth 12 ) LunarMonth -= 12;
today=new Date();
function initArray(){
this.length=initArray.arguments.length
for(var i=0;ithis.length;i++)
this[i+1]=initArray.arguments[i] }
var d=new initArray("星期日","星期一","星期二","星期三","星期四","星期五","星期六");
document.write("", today.getYear(),"年",today.getMonth()+1,"月",today.getDate(),"日 ",d[today.getDay()+1],"");
months = ["一","二","三","四","五","六","七","八","九","十","十一","十二"];
days = ["初一","初二","初三","初四","初五","初六","初七","初八","初九","初十","十一","十二","十三","十四","十五","十六","十七","十八","十九","二十","廿一","廿二","廿三","廿四","廿五","廿六","廿七","廿八","廿九","三十"];
document.write( " 农历"+months[LunarMonth-1]+"月" + days[LunarDate-1] + "");
return 0;
}
function GetLeap( year )
{
if ( year % 400 == 0 )
return 1;
else if ( year % 100 == 0 )
return 0;
else if ( year % 4 == 0 )
return 1;
else
return 0;
}
function tagLunarCal( d, i, w, k, m1, m2, m3, m4, m5, m6, m7, m8, m9, m10, m11, m12, m13) {
this.BaseDays = d;
this.Intercalation = i;
this.BaseWeekday = w;
this.BaseKanChih = k;
this.MonthDays = [ m1, m2, m3, m4, m5, m6, m7, m8, m9, m10, m11, m12, m13 ];
}
//--
/SCRIPT
a target=_blank href=;FONT color=#2b68a7SCRIPTCalConv();/SCRIPT/FONT/a
/body
/html
谁能给一段点击之后出现日历的代码
html
head
title/title
meta http-equiv="Content-Type" content="text/html; charset=gb2312"
/head
body bgcolor="#FFFFFF" text="#000000" leftMargin="0" topMargin="0"
script
Seperator = "-";
var DateStr = "";
// value为指定格式的日期字符串
function SetDateFromCalendar(value)
{
if(top.frames.length0)
{
top.frames("mainFrame").DateObjCtrl_SetDateValue(value);
}
else
{
parent.DateObjCtrl_SetDateValue(value);
}
DateStr = value;
}
// 返回日期字符串
function public_getSelectedDate()
{
return DateStr;
}
/script
script language="JavaScript"
var gdCtrl = new Object();
var gcGray = "#808080";
var gcToggle = "#ffff00";
var gcBG = "#cccccc";
var gdCurDate = new Date();
var giYear = gdCurDate.getFullYear();
var giMonth = gdCurDate.getMonth()+1;
var giDay = gdCurDate.getDate();
var VicPopCal = new Object();
// 显示日历控件
function fPopCalendar(popCtrl, dateCtrl, popCal){
parent.event.cancelBubble=true;
VicPopCal = popCal; // 弹出日历控件的ID
gdCtrl = dateCtrl; // 得到日期数字的控件ID, popCtrl是指定日期控件出现位置的标识
fSetYearMon(giYear, giMonth);
var point = fGetXY(popCtrl); // 得到popCtrl的坐标
with (VicPopCal.style) {
left = point.x;
top = point.y+popCtrl.offsetHeight+1; // 设置日历控件的坐标
visibility = 'visible';
}
VicPopCal.focus();
}
// 隐藏日历控件, 设置gdCtrl的值, 单击今天日期后执行该函数
// 直接得到日期字符串
function fSetDate(iYear, iMonth, iDay){
gdCtrl.value = iMonth+"-"+iDay+"-"+iYear; //Here, you could modify the locale as you need !!!!
VicPopCal.style.visibility = "hidden";
}
// 单击表格执行此函数
function fSetSelected(aCell){
var iOffset = 0;
var iYear = parseInt(tbSelYear.value);
var iMonth = parseInt(tbSelMonth.value);
aCell.bgColor = gcBG;
// 此段代码,控制要是点中的不是当月的日期,自动得到前一个月或后一个月
with (aCell.children["cellText"]){
var iDay = parseInt(innerText);
if (color==gcGray)
iOffset = (Victor10)?-1:1;
iMonth += iOffset;
if (iMonth1) {
iYear--;
iMonth = 12;
}else if (iMonth12){
iYear++;
iMonth = 1;
}
}
// 获得年月日期数
var dateText = parseInt(aCell.innerText);
if(iMonth10)
iMonth = "0" + iMonth;
if(aCell.innerText10)
dateText = "0" + dateText;
// 将年月日组成指定字符串传给回传函数
SetDateFromCalendar(iYear + Seperator + iMonth + Seperator + dateText);
}
// 指定当前object的显示位置
function Point(iX, iY){
this.x = iX;
this.y = iY;
}
// 建立当月的日期数组
function fBuildCal(iYear, iMonth) { // 传过来的月加了1,表示下一月
var aMonth=new Array();
for(i=1;i7;i++)
aMonth[i]=new Array(i);
// 创建当前月第一天日期对象
var dCalDate=new Date(iYear, iMonth-1, 1);
var iDayOfFirst=dCalDate.getDay();//得到该日是星期几
var iDaysInMonth=new Date(iYear, iMonth, 0).getDate();// 得到下一月
var iOffsetLast=new Date(iYear, iMonth-1, 0).getDate()-iDayOfFirst+1;
var iDate = 1;
var iNext = 1;
for (d = 0; d 7; d++)
aMonth[1][d] = (diDayOfFirst)?-(iOffsetLast+d):iDate++;
for (w = 2; w 7; w++)
for (d = 0; d 7; d++)
aMonth[w][d] = (iDate=iDaysInMonth)?iDate++:-(iNext++);
return aMonth;
}
// 画出星期title,和显示数据
function fDrawCal(iYear, iMonth, iCellWidth, iDateTextSize) {
var WeekDay = new Array("日","一","二","三","四","五","六");
var styleTD = " bgcolor='"+gcBG+"' width='"+iCellWidth+"' bordercolor='"+gcBG+"' valign='middle' align='center' style='font:bold "+iDateTextSize+" Courier;";
with (document) {
write("tr");
for(i=0; i7; i++)
write("td "+styleTD+"color:#990099' " + WeekDay[i] + "/td");
write("/tr");
for (w = 1; w 7; w++) {
write("tr");
for (d = 0; d 7; d++) {
write("td id=calCell "+styleTD+"cursor:hand;' onMouseOver='this.bgColor=gcToggle' onMouseOut='this.bgColor=gcBG' onclick='fSetSelected(this)'");
write("font id=cellText Victor='KinLee' /font");
write("/td")
}
write("/tr");
}
}
}
// 填入表格日期数据,可用的和不可用的用不同的底色来区分
function fUpdateCal(iYear, iMonth) {
myMonth = fBuildCal(iYear, iMonth); // 初始化当月的日期显示数组
var i = 0;
for (w = 0; w 6; w++)
for (d = 0; d 7; d++)
with (cellText[(7*w)+d]) { // cellText是表格的标识,都叫cellText,用下标来指示
Victor = i++;
if (myMonth[w+1][d]0) {
color = gcGray;
innerText = -myMonth[w+1][d];
}else{
color = ((d==0)||(d==6))?"red":"black"; // 星期六、日颜色为红色
innerText = myMonth[w+1][d];
}
}
}
// 在下拉框中选中当前年和月, 然后更新数据显示
function fSetYearMon(iYear, iMon){
tbSelMonth.options[iMon-1].selected = true;
for (i = 0; i tbSelYear.length; i++)
if (tbSelYear.options[i].value == iYear)
tbSelYear.options[i].selected = true;
fUpdateCal(iYear, iMon);
}
// 上一月
function fPrevMonth(){
var iMon = tbSelMonth.value;
var iYear = tbSelYear.value;
if (--iMon1) {
iMon = 12;
iYear--;
}
fSetYearMon(iYear, iMon);
}
// 下一月
function fNextMonth(){
var iMon = tbSelMonth.value;
var iYear = tbSelYear.value;
if (++iMon12) {
iMon = 1;
iYear++;
}
fSetYearMon(iYear, iMon);
}
function fGetXY(aTag){
var oTmp = aTag;
var pt = new Point(0,0);
do {
pt.x += oTmp.offsetLeft;
pt.y += oTmp.offsetTop;
oTmp = oTmp.offsetParent;
} while(oTmp.tagName!="BODY");
return pt;
}
var gMonths = new Array("01","02","03","04","05","06","07","08","09","10","11","12");
//打印出年月日的显示的表格,之后再填入数字
with (document) {
write("table id='popTable' border='0' bgcolor='#6699cc'");
write("TR");
write("td valign='middle' align='center'input type='button' name='PrevMonth' value='' style='height:20;width:20;FONT:16 Fixedsys' onClick='fPrevMonth()'");
write(" SELECT name='tbSelYear' onChange='fUpdateCal(tbSelYear.value, tbSelMonth.value)' Victor='Won'");
for(i=2000;i3000;i++)
write("OPTION value='"+i+"'"+i+"/OPTION");
write("/SELECT");
write(" select name='tbSelMonth' onChange='fUpdateCal(tbSelYear.value, tbSelMonth.value)' Victor='Won'");
for (i=0; i12; i++)
write("option value='"+(i+1)+"'"+gMonths[i]+"/option");
write("/SELECT");
write(" input type='button' name='NextMonth' value='' style='height:20;width:20;FONT:16 Fixedsys' onclick='fNextMonth()'");
write("/td");
write("/TRTR");
write("td align='center'");
write("DIV style='background-color:teal;'table width='100%' border='0' cellpadding='2'");
fDrawCal(giYear, giMonth, 19, 12);
write("/table/DIV");
write("/td");
write("/TRTRTD align='center'");
write("font style='cursor:hand;font:12 Fixedsys' onclick='fSetDate(giYear,giMonth,giDay)' onMouseOver='this.style.color=gcToggle' onMouseOut='this.style.color=0'今天是: "+giYear+"年"+gMonths[giMonth-1]+"月"+giDay+"日"+"/font");
write("/TD/TR");write("/TD/TR");
write("/TABLE");
}
var today = new Date();
// 用当前的日期更新月历显示
fSetYearMon(today.getFullYear(), today.getMonth() + 1);
// 填入表格日期数据,可用的和不可用的用不同的底色来区分
//fUpdateCal(today.getFullYear(), today.getMonth() + 1);
/script
/body
/html
html时间日历代码的介绍就聊到这里吧，感谢你花时间阅读本站内容，更多关于、html时间日历代码的信息别忘了在本站进行查找喔。
