0
자바 스크립트 코드가 스톱워치 타이머로 작동합니다. 이제 상황은 다음과 같습니다. 시작 단추를 클릭 한 다음 타이머 시작 및 단추 중지 단추로 전환, 중지를 누른 경우에는 타이머 정지 및 시간이 마지막 상태로 설정됩니다. 버튼을 클릭하면 타이머가 멈추고 00 : 00 : 00으로 재설정됩니다.
여분의 재설정 버튼이 필요하지 않습니다. 모든자바 스크립트 타이머를 00 : 00 : 00으로 재설정해야합니다.
enter code here
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<script type="text/javascript" src="http://code.jquery.com/jquery-1.3.2.js"></script>
<script type="text/javascript">
function PadDigits(n, totalDigits)
{
n = n.toString();
var pd = '';
if (totalDigits > n.length)
{
for (i=0; i < (totalDigits-n.length); i++)
{
pd += '0';
}
}
return pd + n.toString();
}
var lastEndTime = null;
var starttime = null;
var endtime = null;
function startTimer()
{
date = new Date();
starttime = date;
if(lastEndTime == null)
{
$('#history').html('');
}
$('#action').html('<img src=".png"><br>Stop Timer');
}
function stopTimer()
{
$('#action').html('<img src="play.png"><br>Start Timer');
date = new Date();
endtime = date;
addRowToTable(starttime,endtime,lastEndTime);
lastEndTime = endtime;
endtime = null;
starttime = null;
}
function addRowToTable(starttime,endtime,lastEndTime)
{
formattedStart = PadDigits(starttime.getHours(),2)+':'+PadDigits(starttime.getMinutes(),2)+":"+PadDigits(starttime.getSeconds(),2);
formattedEnd = PadDigits(endtime.getHours(),2)+':'+PadDigits(endtime.getMinutes(),2)+":"+PadDigits(endtime.getSeconds(),2);
seconds = parseInt((endtime.getTime() - starttime.getTime())/1000);
lengthMinutes = parseInt(seconds/60);
lengthSeconds = parseInt(seconds%60);
lengthFormatted = PadDigits(lengthMinutes,2)+":"+PadDigits(lengthSeconds,2);
}
function toggleTimer()
{
if (starttime == null)
{
startTimer();
}
else
{
stopTimer();
}
}
$(document).ready(function(){
$('#action').click(function(kevent){
toggleTimer();
});
$(document).keypress(function(kevent){
$('#action').click();
});
});
</script>
<script type="text/javascript"> <!--javascript declaration-->
var sec = 0; //declare global variable called sec and assign 0
var mins = 0; //declare global variable called mins and assign 0
var hour = 0; //declare global variable called hour and assign 0
function changestat(){ //declare a function called changestat()
var a=document.getElementById('butn').value; //take the value by id called 'butn' and store that in a variable called 'a'
if(a=='Start'){ //declare if block if a is equal to 'Start'
document.getElementById('butn').value='Pause'; //change the value of 'butn' from 'Start' to 'Pause'
} //end of if block
else if(a=='Pause'){ //declare else if block if a is equal to 'Pause'
document.getElementById('butn').value='Start'; //change the value of 'butn' from 'Pause' to 'Start'
} //end of else if block
stopwatch(); //call the function called stopwatch()
} //end of changestat() function
function stopwatch(){ //declare a function called stopwatch()
var x=document.getElementById('butn').value; //take the value by id called 'butn' and store that in a variable called 'x'
if (x=='Pause'){ //declare if block if x is equal to 'Pause'
sec++; //keep adding '1' to the value of sec variable
if (sec == 60) { //declare if block if sec is equal to '60'
sec = 0; //set the value of sec to '0'
mins = mins + 1; //add '1' to current value of mins
} //end of if block
else { //start of else block
mins = mins; //the value of mins remains same
} //end of else block
if (mins == 60) { //declare if block if mins is equal to '60'
mins = 0; //set the value of mins to '0'
hour += 1; //add '1' to current value of hours
} //end of if block
if (sec<=9) { //declare if block if sec is less than or equal to '9'
sec = "0" + sec; //here we add 0 in front of the number eg: 01
} //end of if block
var stwa=document.getElementById('stwa'); //take the element by id called 'stwa' and store that in a variable called 'stwa'
stwa.value= ((hour<=9) ? "0"+hour : hour) + " : " + ((mins<=9) ? "0" + mins : mins) + " : " + sec; //set the value in stwa text field eg:00:02:01
SD=window.setTimeout("stopwatch();", 1000); //this line will refresh the value of stwa textfield every second
} //end of if block
} //end of stopwatch() function
function reset(){ //declare a function called reset()
var stwa=document.getElementById('stwa'); //take the element by id called 'stwa' and store that in a variable called 'stwa'
sec = 0; //set the value of sec to '0'
mins = 0; //set the value of mins to '0'
hour = 0; //set the value of hour to '0'
stwa.value='00 : 00 : 00'; //display 00:00:00 in text field
changestat(); //call the function called changestat()
} //end of reset() function
</script> <!--end of the javascript -->
</head>
<body>
<input type="text" value="00 : 00 : 00" id="stwa"/> <!--create a inputfield which has stwa as id ans 00:00:00 as value -->
<br/><br/>
<button onClick="changestat()" id="action"><img src="play.png"><br>Start Timer</button>
<!---<input type="button" value="Reset" id="reset" onClick="reset()"/> <!--create a button which has reset as id and Reset as value and tell that to execute reset() function when it is clicked-->
<input type="hidden" value="Start" id="butn" onClick="changestat()"/> <!--create a button which has butn as id and Start as value and tell that to execute changestat() function when it is clicked-->
</body>
</html>
. 고맙습니다. – user3176335
답변을 수락했습니다. –