<!DOCTYPE html>
<head>
<title>测试</title>
<style type="text/css">
#demo h2{margin:20px 0 20px 20%;font:normal 24px/1.5 'Comic Sans MS';letter-spacing:2px;line-hight:2}
#demo h2 em{margin-right:12px;padding:0 7px;border-top-left-radius:8px;-webkit-border-top-left-radius:8px;-moz-border-radius-topleft:8px;background:#d2d9df;color:#000;font-family:\5fae\8f6f\96c5\9ed1;letter-spacing:0}
#demo h2 span{text-shadow:1px 2px 3px #ccc}
</style>
</head>
<body>
<div id="demo">
<h2>显示当前时间:<span id="time24"></span></h2>
</div>
<script type="text/javascript">
window.onload = function(){nowTime(document.getElementById("time24"))};
function nowTime(ev,type){
/*
* ev:显示时间的元素
* type:时间显示模式.若传入12则为12小时制,不传入则为24小时制
*/
//年月日时分秒
var Y,M,D,W,H,I,S;
//月日时分秒为单位时前面补零
function fillZero(v){
if(v<10){v='0'+v;}
return v;
}
(function(){
var d = new Date();
var Week=['星期天','星期一','星期二','星期三','星期四','星期五','星期六'];
Y = d.getFullYear();
M = fillZero(d.getMonth()+1);
D = fillZero(d.getDate());
W = Week[d.getDay()];
H = fillZero(d.getHours());
I = fillZero(d.getMinutes());
S = fillZero(d.getSeconds());
//12小时制显示模式
if(type && type==12){
//若要显示更多时间类型诸如中午凌晨可在下面添加判断
if(H<=12){
H='上午 '+H;
}else if(H>12 && H<24){
H-=12;
H='下午 '+fillZero(H);
}else if(H==24){
H='下午 00';
}
}
ev.innerHTML=Y+'年'+M+'月'+D+'日 '+' '+W+' '+H+':'+I+':'+S;
//每秒更新时间
setTimeout(arguments.callee,1000);
})();
}
</script>
</body>
</html>
运行效果:
java后台获取当前时间,前台显示计算:
<script type="text/javascript">
var time_diff = new Date(<%=new java.util.Date().getTime()%>) - new Date();
$(document).ready(function(){
window.setInterval("show_nowTime()",1000);
});
function show_nowTime(){
var currentDate_ = new Date();
currentDate_.setMilliseconds(currentDate_.getMilliseconds() + time_diff);
var year=currentDate_.getFullYear();
var month=currentDate_.getMonth()+1;
var date=currentDate_.getDate();
var h=currentDate_.getHours();
var m=currentDate_.getMinutes();
var s=currentDate_.getSeconds();
// add a zero in front of numbers<10
year=checkTime(year);
month=checkTime(month);
date=checkTime(date);
h=checkTime(h);
m=checkTime(m);
s=checkTime(s);
$("#show_nowTime").html("");
var time_html = " "+year+"-"+month+"-"+date+" "+h+":"+m;
$("#show_nowTime").html(time_html);
$("#globalWeb_dateTime").val("");
var time_val = ""+year+"-"+month+"-"+date+" "+h+":"+m+":"+s;
$("#globalWeb_dateTime").val(time_val);
}