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 相关文章推荐
(推荐一个超好的JS函数库)S.Sams Lifexperience ScriptClassLib
Apr 29 Javascript
javascript判断用户浏览器插件安装情况的代码
Jan 01 Javascript
鼠标划过实现延迟加载并隐藏层的js代码
Oct 11 Javascript
基于JavaScript实现通用tab选项卡(通用性强)
Jan 07 Javascript
window.open不被拦截的简单实现代码(推荐)
Aug 04 Javascript
jQuery动态产生select option下拉列表
Mar 15 Javascript
jQuery实现div跟随鼠标移动
Aug 20 jQuery
angular使用post、get向后台传参的问题实例
May 27 Javascript
原生JS控制多个滚动条同步跟随滚动效果
Dec 22 Javascript
微信开发之企业付款到银行卡接口开发的示例代码
Sep 18 Javascript
Vue最新防抖方案(必看篇)
Oct 30 Javascript
JS运算符优先级与表达式示例详解
Sep 04 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
Symfony学习十分钟入门经典教程
2016/02/03 PHP
Yii1.1框架实现PHP极光推送消息通知功能
2018/09/06 PHP
PHP标准库 (SPL)――Countable用法示例
2020/06/05 PHP
初识JQuery 实例一(first)
2011/03/16 Javascript
循环 vs 递归浅谈
2013/02/28 Javascript
js采用map取到id集合组并且实现点击一行选中一行
2013/12/16 Javascript
jquery.post用法之type设置问题
2014/02/24 Javascript
JavaScript数据推送Comet技术详解
2016/04/07 Javascript
jQuery调用Webservice传递json数组的方法
2016/08/06 Javascript
js模块加载方式浅析
2017/08/12 Javascript
Js中async/await的执行顺序详解
2017/09/22 Javascript
帝国cms首页列表页实现点赞功能
2017/10/30 Javascript
解决Vue 浏览器后退无法触发beforeRouteLeave的问题
2017/12/24 Javascript
js 取消页面可以选中文字的功能方法
2018/01/02 Javascript
详解ES6 export default 和 import语句中的解构赋值
2019/05/28 Javascript
VUE实现移动端列表筛选功能
2019/08/23 Javascript
layui实现数据表格自定义数据项
2019/10/26 Javascript
如何使用jQuery操作Cookies方法解析
2020/09/08 jQuery
Python的一些用法分享
2012/10/07 Python
Python基于matplotlib绘制栈式直方图的方法示例
2017/08/09 Python
Python tkinter实现的图片移动碰撞动画效果【附源码下载】
2018/01/04 Python
Python实现矩阵相乘的三种方法小结
2018/07/26 Python
selenium+python 对输入框的输入处理方法
2018/10/11 Python
Dlib+OpenCV深度学习人脸识别的方法示例
2019/05/14 Python
Python生成验证码、计算具体日期是一年中的第几天实例代码详解
2019/10/16 Python
澳大利亚领先的在线美容商城:Adore Beauty
2017/04/14 全球购物
英国最大的宠物商店:Pets at Home
2019/04/17 全球购物
韩国最大的购物网站:Gmarket
2019/06/20 全球购物
用你熟悉的语言写一个连接ORACLE数据库的程序,能够完成修改和查询工作
2012/06/11 面试题
公司委托书格式范文
2014/04/04 职场文书
应届毕业生求职简历自我评价
2015/03/02 职场文书
2016年小学“公民道德宣传日”活动总结
2016/04/01 职场文书
护理自荐信
2019/05/14 职场文书
在HTML中引入CSS的几种方式介绍
2021/12/06 HTML / CSS
Ruby序列化和持久化存储 Marshal和Pstore介绍
2022/04/18 Ruby
Windows Server 修改远程桌面端口的实现
2022/06/25 Servers