软件学堂

网游分类软件分类

JS实现12小时制和24小时制的转换

2012-11-05 来源:网络

【实例名称】

JS实现12小时制和24小时制的转换

【实例描述】

表示时间的方式有24小时制和12小时制。如果是12小时制的时间,通常显示“上午”或“下午”。本例学习如何实现小时制间的转换。

【实例代码】

<html xmlns="http://www.w3.org/1999/xhtml" > <head> <title>标题页-学无忧(www.xue51.com)</title> <SCRIPT LANGUAGE="JavaScript"> function timeType() {     if (document.form.showTimeType[0].checked) { //判断选择的是哪个类型-24小时就返回true     return true; } return false; } function showTheHours(theHour) {     if (timeType() || (theHour > 0 && theHour < 13)) { //如果时间在12小时内     return (theHour);     }     if (theHour == 0) {                              //如果时间等于0         return (12);     }     return (theHour-12);                             //如果时间大于12,需要减去12-针对12小时制 } function showZeroFilled(inValue) {     if (inValue > 9) {                              //设置分钟数的两位数显示,不足两位补0     return "" + inValue;     }     return "0" + inValue;     }     function showAmPm() {                          //显示上午或下午的方法     if (timeType()) {     return ("");     }     if (now.getHours() < 12) {  //判断日期,显示12小时制的中文提示     return (" 上午");     }     return (" 下午"); } function showTheTime() {    //显示时间的方法     now = new Date          //获取当前时间     document.form.showTime.value = showTheHours(now.getHours()) + ":" + showZeroFilled(now.getMinutes()) + ":" + showZeroFilled(now.getSeconds()) + showAmPm()     setTimeout("showTheTime()",1000)  //每隔1秒更新时间 } </script> </head> <BODY onLoad="showTheTime()"> <center><form name=form> <input type=text name=showTime size=11><p> <input type=radio name=showTimeType checked>24小时<br> <input type=radio name=showTimeType>12小时<br> </form></center></body> </html>

【运行效果】

 12小时制和24小时制的转换运行效果

【难点剖析】

本例的难点是12小时制日期的显示问题。默认的显示时间是24小时制,如果显示12小时制,需要判断时间是否在12小时内,如果小于12小时,只需要原样显示时间,同时为时问添加“上午”标识;如果大于12小时,则需要减去12,并添加“下午”标识。

【源码下载】

为了JS代码的准确性,请点击:12小时制和24小时制的转换 进行本实例源码下载 

上一篇:pagefile.sys是什么文件,可以删除吗
下一篇:PS调色技巧:调出美女图片暗调蓝红色

相关文章