k01ken’s b10g

He110 W0r1d!

Javascript(jQuery)でタイマーを作る

JavaScript jQuery

開発環境は、Windows7 Professional(32bit)+firefox 57.0.2(32bit)+jQuery3.2.1。

<!DOCTYPE html>
<html lang="ja">
<head>
	<meta charset="utf-8">
	<script src="jquery-3.2.1.min.js"></script>
<style>
</style>
<script>
var s_count = 0;
var m_count = 0;
var h_count = 0;

$(document).ready(function(){

	$(function(){
		setInterval(function(){

			if(s_count != 0 && m_count != 0 && s_count % 3600 == 0){
				h_count++;
			}

			if(s_count != 0 && s_count % 60 == 0){
				m_count++;
			}

			if(s_count >= 3600){
				var hour = s_count - (3600 * h_count);
				var minute = Math.floor(hour / 60);
				var second = hour % 60;
				$("#t").text(h_count + "時間" + minute + "分" + second + "秒");
			}else if(s_count >= 60){
				var second = s_count - (60 * m_count);
				$("#t").text(m_count + "分" + second + "秒");				
			}else{
				$("#t").text(s_count + "秒");
			}
			s_count++;
		},1000);
	});

});
</script>
</head>
<body>
<h1>タイマー</h1>
<div id="t"></div>
</body>
</html>