Jquery实现的计时功能
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<script src="js/jquery.js"></script>
</head>
<body>
<div style="width: 150px;height: 100px;background-color:pink;" align="center" >
<div id="show" style="width: 60px;height: 40px;"></div>
<input type="button" id="time" value="start" />
</div>
<script type="text/javascript">
$("#time").on("click",function(){
var hour = 0;
var min = 0;
var sen = 0;
function showTime(){
sen++;
if(sen>=60){
min++;
sen = 0;
}
if(min>=60){
hour++;
min = 0;
}
if(hour>=12){
hour = 0;
}
var dataStr = (hour<10?("0"+hour):hour)+":"+(min<10?("0"+min):min)+":"+(sen<10?("0"+sen):sen);
$("#show").text(dataStr);
}
setInterval(function(){
showTime();
},1000);
});
</script>
</body>
</html>
效果图