jQuery 타이머 / jQuery 타이머 만들기 / 스톱, 스타드 구현

 

ajax 호출 후 응답시간이 얼마나 걸리는지 확인 하기 위해서 하나 만들어 보았습니다.

ajax 호출시작시 startTimer() 를 호출하고, ajax success 부분에서 stopTimer() 함수 호출해주면 되겠네요.

 

결과페이지

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<script language="javascript">


var timer =0;

function resetTimer(){
	$("#hid_sec").val(0);
	$("#sec").html("0");
}


function startTimer(){
	timer = setInterval(function () {
		$("#hid_sec").val(Number($("#hid_sec").val()) + 1);
		$("#sec").html($("#hid_sec").val());
	 }, 1000); 
}


function stopTimer(){
	clearInterval(timer);
}

</script>
</head>
<body>
 <div>
	<span id="sec">0</span>
	<input type="hidden" id="hid_sec" value="0"/>
	<a href="javascript:;" onclick="startTimer();">시작</a> 
	<a href="javascript:;" onclick="stopTimer();">스톱</a> 
	<a href="javascript:;" onclick="resetTimer();">리셋</a> 
</div>

</body>

</html>

 

+ Recent posts