js实现Form栏显示全格式时间时钟效果代码
内容摘要
本文实例讲述了js实现Form栏显示全格式时间时钟效果代码。分享给大家供大家参考。具体如下：
这里演示的Form栏特效时钟，显示全日期格式的时间日期效果，可显示星期几、几月几号，
这里演示的Form栏特效时钟，显示全日期格式的时间日期效果，可显示星期几、几月几号，
文章正文
本文实例讲述了js实现Form栏显示全格式时间时钟效果代码。分享给大家供大家参考。具体如下：
这里演示的Form栏特效时钟，显示全日期格式的时间日期效果，可显示星期几、几月几号，以往都是直接显示在网页中，而本代码是将时间显示在表单的文本框中，看一下代码就明白了。
运行效果截图如下：
在线演示地址如下：
http://demo.phpstudy.net/js/2015/js-form-input-showtime-codes/
具体代码如下：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE>Form栏特全时钟</TITLE>
</HEAD>
<body bgcolor="#ffffff" onLoad="startclock()">
<script language="JavaScript">
<!-- Hide
var timerID = null
var timerRunning = false
function MakeArray(size)
{
this.length = size;
for(var i = 1; i <= size; i++)
{
this[i] = "";
}
return this;
}
function stopclock (){
if(timerRunning)
clearTimeout(timerID);
timerRunning = false
}
function showtime () {
var now = new Date();
var year = now.getFullYear();
var month = now.getMonth() + 1;
var date = now.getDate();
var hours = now.getHours();
var minutes = now.getMinutes();
var seconds = now.getSeconds();
var day = now.getDay();
Day = new MakeArray(7);
Day[0]="星期天";
Day[1]="星期一";
Day[2]="星期二";
Day[3]="星期三";
Day[4]="星期四";
Day[5]="星期五";
Day[6]="星期六";
var timeValue = "";
timeValue += year + "年";
timeValue += ((month < 10) ? "0" : "") + month + "月";
timeValue += date + "日 ";
timeValue += (Day[day]) + " ";
timeValue += ((hours <= 12) ? hours : hours - 12);
timeValue += ((minutes < 10) ? ":0" : ":") + minutes;
timeValue += ((seconds < 10) ? ":0" : ":") + seconds;
timeValue += (hours < 12) ? "上午" : "下午";
document.jsfrm.face.value = timeValue;
timerID = setTimeout("showtime()",1000);
timerRunning = true
}
function startclock () {
stopclock();
showtime()
}
//-->
</script>
<form name='jsfrm'>
<input type=text name='face' size=34 value=''>
</form>
</BODY>
</HTML>
希望本文所述对大家的javascript程序设计有所帮助。
代码注释
作者：喵哥笔记
