HTML

<div>
	<button type="button" onclick="start_timer()">시작</button>
	<button type="button" onclick="stop_timer()">종료</button>
</div>
<p class="counter">0</p>

<!--javascript-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="cookie.js"></script>

JAVASCRIPT

var setimeout_var;
var timer_flag = 0;

function timer(){
	var time = new Date();
	var second = time.getTime() / 1000;
	count = second - getCookie('startSecond');
	$('.counter').text(parseInt(count));
	setimeout_var = setTimeout(timer, 1000);
}

function start_timer(){
	if(timer_flag == 0){
		var time = new Date();
		var second = time.getTime() / 1000;
		setCookie('startSecond', second, 7);
		timer_flage = 1;
		setTimeout(timer, 1000);
	}
}

function stop_timer(){
	deleteCookie('startSecond');
	clearTimeout(setimeout_var);
	clearTimeout(setimeout_var);
	clearTimeout(setimeout_var);
	timer_flage = 0;
	$('.counter').text('0');
}

REFERENCE

  1. 'cookie.js' 다운로드 링크
  1. 내용 설명
  • 1초 마다 0부터 숫자 증가
profile
TJ

0개의 댓글