fork download
copy 
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. 	<meta charset="UTF-8">
  5. 	<meta http-equiv="X-UA-Compatible" content="IE=edge">
  6. 	<meta name="viewport" content="width=device-width, initial-scale=1.0">
  7. 	<title>Document</title>
  8. 	<style type="text/css">
  9. 	body
  10. 	{
  11. 		width:300px;
  12. 	}
  13. 	#timer
  14. 	{
  15. 		text-align: center;
  16. 		font-size: 50px;
  17. 	}
  18. 	.controls{
  19. 		display: flex;
  20. 		justify-content: space-between;
  21. 	}
  22. 	.btn{
  23. 		padding:10px;
  24. 		background-color: pink;
  25. 		cursor: pointer;
  26. 	}
  27. 	</style>
  28. </head>
  29. <body>
  30.  
  31. 	<div id="timer">00</div>
  32. 	<div class="controls">
  33. 	  <div id="start" class="btn">Start</div>
  34. 	  <div id="reset" class="btn">Reset</div>
  35. 	</div>
  36.  
  37. 	<script>
  38. 		let start = document.getElementById("start");
  39. 		let timer = document.getElementById("timer");
  40. 		let mode = "stop";
  41. 		let startTime;
  42. 		let nowTime;
  43. 		let addTime = 100;//累積
  44. 		let diff;
  45. 		let countTimer;
  46.  
  47.  
  48. 		start.addEventListener("click" , function()
  49. 		{
  50. 			switch(mode)
  51. 			{
  52. 				case "stop":
  53. 					startTime = new Date().getTime();
  54. 					getDiff();
  55.  
  56. 					mode = "run";
  57. 					console.log("run" , addTime);
  58. 					break;
  59. 				case "run":
  60. 					clearTimeout(countTimer);	
  61.  
  62. 					mode = "stop";
  63. 					console.log("stop" , addTime);
  64. 					break;
  65. 			}
  66. 		});
  67.  
  68. 		let getDiff = function()
  69. 		{
  70. 			nowTime = new Date().getTime();
  71. 			diff =  (nowTime - startTime) ;
  72. 			timer.textContent = diff / 1000//秒数をセット;
  73. 			countTimer = setTimeout(getDiff , 50);
  74. 		}
  75.  
  76. 	</script>
  77. </body>
  78. </html>
Not running #stdin #stdout 0s 0KB
comments (?)
stdin
copy 
Standard input is empty
stdout
copy 
Standard output is empty
https://ideone.com/Fq7ki3
language:
Text (text 6.10)
created:
2 years ago
visibility:
secret

Share or Embed source code

Discover > Sphere Engine API

The brand new service which powers Ideone!

Discover > IDE Widget

Widget for compiling and running the source code in a web browser!