setTimeout用法

最新推荐文章于 2024-08-25 08:30:00 发布

忆成风

最新推荐文章于 2024-08-25 08:30:00 发布

阅读量1.5k

点赞数

分类专栏： html

本文链接：https://blog.csdn.net/lhzau1996/article/details/83629185

版权

html 专栏收录该内容

30 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>setTimeout方法</title>
		<script type="text/javascript" src="js/jquery-3.1.1.min.js"></script>
	</head>

	<body>
		<a onclick="methodOne()" style="cursor: pointer;">one</a>
		<!--设置2秒后执行的方法-->
		<button onclick="setTimeout('methodTwo()',2000)">two</button>
		<button onclick="methodThree()">three</button>
		<button onclick="methodFive()">five</button>
		<input id="four" value="0" size="4" style="display: block;margin-top: 10px;" />
		<button onclick="methodSix()">six</button>
		<!--分秒计时-->
		<span>计时：</span>
		<input id="seven" value="0" />：分
		<input id="eight" value="0" />：秒
		<br />
		<!--计时与停止（连续按计时可加速计时,需多次点击停止）-->
		<input id="nine" value="0"/>
		<button onclick="methodNine()">计时</button>
		<button onclick="clearTimeout(nine)">停止</button>
		<br />
		<!--多次点击不会加速-->
		<input id="ten" value = "0"/>
		<button onclick="restart()">计时</button>
		<button onclick="clearTimeout(ten);flag =0">停止</button>
		<script>
			function methodOne() {
				//以ms为单位
				setTimeout("alert('点击后，过3秒出现')", 3000);
			}

			function methodTwo() {
				alert("2秒");
			}

			var x = 0;

			function methodThree() {
				x = x + 1;
				$("#four").val(x);
			}

			//每秒加1
			var y = 0;

			function methodFive() {
				y = y + 1;
				$("#four").val(y);
				setTimeout("methodFive()", 1000)
			}

			//分和秒
			var m = -1;
			var s = 0;

			function methodSix() {
				methodSeven();
				methodEight();
			}

			function methodSeven() {
				m = m + 1;
				$("#seven").val(m);
				setTimeout("methodSeven()", 60000);
			}

			function methodEight() {
				s = s + 1;
				var z = s % 60;
				$("#eight").val(z);
				setTimeout("methodEight()", 1000);
			}

			var a = 0;
			function methodNine() {
				a = a + 1;
				$("#nine").val(a)
				nine = setTimeout("methodNine()",1000);
			}
			
			var b = 0;
			flag = 0;
			
			function restart(){
				if(flag == 0){
					methodTen();	
				}
			}
			
			function methodTen(){
				b = b +1;
				$("#ten").val(b);
				ten = setTimeout("methodTen()",1000)
				flag = 1;
			}
		</script>
	</body>

</html>