js实现Form栏显示全格式时间时钟效果代码


Posted in Javascript onAugust 19, 2015

本文实例讲述了js实现Form栏显示全格式时间时钟效果代码。分享给大家供大家参考。具体如下:

这里演示的Form栏特效时钟,显示全日期格式的时间日期效果,可显示星期几、几月几号,以往都是直接显示在网页中,而本代码是将时间显示在表单的文本框中,看一下代码就明白了。

运行效果截图如下:

js实现Form栏显示全格式时间时钟效果代码

在线演示地址如下:

具体代码如下:

<!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程序设计有所帮助。

Javascript 相关文章推荐
utf8的编码算法 转载
Dec 27 Javascript
利用js对象弹出一个层
Mar 26 Javascript
JavaScript DOM学习第四章 getElementByTagNames
Feb 19 Javascript
javascript下数值型比较难点说明
Jun 07 Javascript
HTML中的setCapture和releaseCapture使用介绍
Mar 21 Javascript
javascript数据结构之双链表插入排序实例详解
Nov 25 Javascript
javascript编程异常处理实例小结
Nov 30 Javascript
关于iframe跨域POST提交的方法示例
Jan 15 Javascript
完美解决jQuery的hover事件在IE中不停闪动的问题
Feb 10 Javascript
JavaScript数据结构之单链表和循环链表
Nov 28 Javascript
JS实现盒子跟着鼠标移动及键盘方向键控制盒子移动效果示例
Jan 29 Javascript
javascript实现贪吃蛇游戏(娱乐版)
Aug 17 Javascript
easyui Droppable组件实现放置特效
Aug 19 #Javascript
js实现简单的联动菜单效果
Aug 19 #Javascript
javascript 使用for循环时该注意的问题-附问题总结
Aug 19 #Javascript
jQuery满意度星级评价插件特效代码分享
Aug 19 #Javascript
easyui Draggable组件实现拖动效果
Aug 19 #Javascript
使用CamanJS在Web页面上处理图像的技巧
Aug 18 #Javascript
JS实现下拉菜单赋值到文本框的方法
Aug 18 #Javascript
You might like
session 的生命周期是多长
2006/10/09 PHP
调试WordPress中定时任务的相关PHP脚本示例
2015/12/10 PHP
kindeditor 加入七牛云上传的实例讲解
2017/11/12 PHP
简单JS代码压缩器
2006/10/12 Javascript
一些经常会用到的Javascript检测函数
2010/05/31 Javascript
js切换div css注意的细节
2012/12/10 Javascript
跟我学Nodejs(一)--- Node.js简介及安装开发环境
2014/05/20 NodeJs
jQuery检测滚动条是否到达底部
2015/12/15 Javascript
基于javascript显示当前时间以及倒计时功能
2016/03/18 Javascript
JavaScript——DOM操作——Window.document对象详解
2016/07/14 Javascript
Centos7 中 Node.js安装简单方法
2016/11/02 Javascript
微信小程序-消息提示框实例
2016/11/24 Javascript
JS 拦截全局ajax请求实例解析
2016/11/29 Javascript
使用Math.max,Math.min获取数组中的最值实例
2017/04/25 Javascript
详解vue-cli构建项目反向代理配置
2017/09/07 Javascript
解决Vue使用mint-ui loadmore实现上拉加载与下拉刷新出现一个页面使用多个上拉加载后冲突问题
2017/11/07 Javascript
JavaScript实现获取select下拉框中第一个值的方法
2018/02/06 Javascript
详解mpvue中使用vant时需要注意的onChange事件的坑
2019/05/16 Javascript
微信小程序制作扭蛋机代码实例
2019/09/24 Javascript
微信小程序学习总结(二)样式、属性、模板操作分析
2020/06/04 Javascript
vscode+gulp轻松开发小程序的完整步骤
2020/10/18 Javascript
[05:09]第二届DOTA2亚洲邀请赛决赛日比赛集锦:iG 3:0 OG夺冠
2017/04/05 DOTA
python3+PyQt5使用数据库表视图
2018/04/24 Python
Python处理命令行参数模块optpars用法实例分析
2018/05/31 Python
python 实现将多条曲线画在一幅图上的方法
2019/07/07 Python
简单了解python变量的作用域
2019/07/30 Python
python进阶之自定义可迭代的类
2019/08/20 Python
Python常用GUI框架原理解析汇总
2020/12/07 Python
纯CSS3实现移动端展开和收起效果的示例代码
2020/04/26 HTML / CSS
大学毕业的自我鉴定
2013/10/08 职场文书
个人授权委托书范本
2014/04/03 职场文书
出生公证委托书
2014/04/03 职场文书
创建青年文明号材料
2014/05/09 职场文书
计算机专业求职信
2014/06/02 职场文书
python 定义函数 返回值只取其中一个的实现
2021/05/21 Python
纯 CSS 自定义多行省略的问题(从原理到实现)
2021/11/11 HTML / CSS