js實現(xiàn)Form欄顯示全格式時間時鐘效果代碼
本文實例講述了js實現(xiàn)Form欄顯示全格式時間時鐘效果代碼。分享給大家供大家參考。具體如下:
這里演示的Form欄特效時鐘,顯示全日期格式的時間日期效果,可顯示星期幾、幾月幾號,以往都是直接顯示在網(wǎng)頁中,而本代碼是將時間顯示在表單的文本框中,看一下代碼就明白了。
運行效果截圖如下:
在線演示地址如下:
http://demo.jb51.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程序設(shè)計有所幫助。
相關(guān)文章
JavaScript判斷是否為數(shù)字的幾種方式匯總(推薦!)
有時候需要根據(jù)輸入的內(nèi)容來進(jìn)行計算,這個時候就需要判斷輸入的內(nèi)容是否是數(shù)字,下面這篇文章主要給大家介紹了關(guān)于JavaScript判斷是否為數(shù)字的幾種方式,文中通過實例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-06-06解析javascript瀑布流原理實現(xiàn)圖片滾動加載
這篇文章主要幫助大家解析javascript瀑布流原理,實現(xiàn)js圖片滾動加載2016-03-03JavaScript事件發(fā)布/訂閱模式原理與用法分析
這篇文章主要介紹了JavaScript事件發(fā)布/訂閱模式,結(jié)合實例形式簡單分析了javascript發(fā)布/訂閱模式的概念、原理及簡單使用方法,需要的朋友可以參考下2018-08-08微信小程序?qū)崿F(xiàn)頂部選項卡(swiper)
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)頂部選項卡效果,文中示例代碼介紹的非常詳細(xì),具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-08-08基于JS實現(xiàn)9種不同的面包屑和分布式多步驟導(dǎo)航效果
本文是小編給大家分享的基于js實現(xiàn)的9種不同風(fēng)格的面包屑和分布式多步驟導(dǎo)航效果,非常不錯,具有參考借鑒價值,需要的朋友參考下2017-02-02