staybuzz/jsTimer.html

## jsTimer.html
<!-- ref: http://www.pori2.net/js/timer/6.html -->
<!-- ref: http://www.24w.jp/study_contents.php?bid=javascript&iid=javascript&sid=string&cid=009 -->
<!DOCTYPE HTML>
<html lang="ja">
<head>
	<meta charset="utf-8">
	<title>Timer</title>
</head>
<body>
	<h1>Timer</h1>
	<form name="timer">
		<input type="text", name="minute", size="3", value="0">min
		<input type="text", name="second", size="3", value="0">sec<br>
		<input type="button", name="start", onclick="countStart()", value="start">
		<input type="button", name="stop", onclick="countStop()", value="stop">
	</form>
	<script>
		function countStart() {	//Startをクリックした時
			document.timer.elements[2].disabled = true; // Startボタンを無効にする
			timer = setInterval('countDown()',1000);
		}

		function countStop () {	// Stopをクリックした時
			document.timer.elements[2].disabled = false; // Enabled Start Button
			clearInterval(timer);
		}

		function countDown () {
			var min = document.timer.elements[0].value;
			var sec = document.timer.elements[1].value;
			if (min === "0" && sec === "0") {
				alert("Please Set Time");
				document.timer.elements[2].disabled = false;
			} else {
				if (min === "") {  min = 0;  }
				if (sec === "") {  sec = 0;  }
				min = parseInt(min, 10);	// Strings to Integer
				sec = parseInt(sec, 10);        // Strings to Integer
				showTime(min,sec);
			}
		}

		function showTime(min, sec) {
			sec--;
			if (min === 0 && sec === 0) {
				document.timer.elements[1].value = sec;
				alert("Finish!");
				reSet();	// Reset Timer
			} else if (sec < 0) {
				min--;
				sec = 59;
				document.timer.elements[0].value = min;	// テキストボックスに反映する
				document.timer.elements[1].value = sec;	//
			} else {
				document.timer.elements[1].value = sec;	//
			}
		}
		function reSet() {
			document.timer.elements[2].disabled = false;
			document.timer.elements[0].value = 0;	// reset form
			document.timer.elements[1].value = 0;	// reset form
			clearInterval(timer);
		}
	</script>
</body>
</html>
	<!-- ref: http://www.pori2.net/js/timer/6.html -->
	<!-- ref: http://www.24w.jp/study_contents.php?bid=javascript&iid=javascript&sid=string&cid=009 -->
	<!DOCTYPE HTML>
	<html lang="ja">
	<head>
	<meta charset="utf-8">
	<title>Timer</title>
	</head>
	<body>
	<h1>Timer</h1>
	<form name="timer">
	<input type="text", name="minute", size="3", value="0">min
	<input type="text", name="second", size="3", value="0">sec<br>
	<input type="button", name="start", onclick="countStart()", value="start">
	<input type="button", name="stop", onclick="countStop()", value="stop">
	</form>
	<script>
	function countStart() { //Startをクリックした時
	document.timer.elements[2].disabled = true; // Startボタンを無効にする
	timer = setInterval('countDown()',1000);
	}

	function countStop () { // Stopをクリックした時
	document.timer.elements[2].disabled = false; // Enabled Start Button
	clearInterval(timer);
	}

	function countDown () {
	var min = document.timer.elements[0].value;
	var sec = document.timer.elements[1].value;
	if (min === "0" && sec === "0") {
	alert("Please Set Time");
	document.timer.elements[2].disabled = false;
	} else {
	if (min === "") { min = 0; }
	if (sec === "") { sec = 0; }
	min = parseInt(min, 10); // Strings to Integer
	sec = parseInt(sec, 10); // Strings to Integer
	showTime(min,sec);
	}
	}

	function showTime(min, sec) {
	sec--;
	if (min === 0 && sec === 0) {
	document.timer.elements[1].value = sec;
	alert("Finish!");
	reSet(); // Reset Timer
	} else if (sec < 0) {
	min--;
	sec = 59;
	document.timer.elements[0].value = min; // テキストボックスに反映する
	document.timer.elements[1].value = sec; //
	} else {
	document.timer.elements[1].value = sec; //
	}
	}
	function reSet() {
	document.timer.elements[2].disabled = false;
	document.timer.elements[0].value = 0; // reset form
	document.timer.elements[1].value = 0; // reset form
	clearInterval(timer);
	}
	</script>
	</body>
	</html>