十秒倒计时开始停止按钮

最新推荐文章于 2022-09-20 10:29:55 发布
最新推荐文章于 2022-09-20 10:29:55 发布
阅读量1.3k 收藏 3
点赞数 3
版权声明：本文为博主原创文章，遵循 CC 4.0 BY 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/HGR19990101/article/details/89315644
版权 
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>倒计时10秒按钮</title>
</head>
<body>
	<button "start()">开始</button>
	<button "stop()">停止</button>
	<strong id="time">10</strong>

</body>
<script type="text/javascript">
	
	var times = null;
	function start(){
		time.innerHTML=10;
		if (times!= null) {
			return false
		}
		var num = 10;
		times =setInterval(function(){
			num--;
			time.innerHTML=num;
			if (num==0) {
				stop();
			}			
		},1000)
	}
	
	function stop(){
		alert("倒计时停止");
		clearInterval(times);
		times = null;

	}
</script>
</html>
阿荣~
关注
  • 3
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
倒计时（10秒）
qh19940911的博客
04-16 2793
10秒倒计时 //标题 <body> <button "start()">开始</button> //设置一个按钮来开始计时，加一个点击事件start（）。 <button "stop()">停止计时</button> //设置一个按钮来停止计时，加一个点击事件stop（）。 <p id="text">1...
Js实现倒计时的效果
Venus_cai的博客
10-31 372
Js实现倒计时的效果 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA...
倒计时数码管显示实验
06-12
999倒计时数码管显示实验 1. 直接将烧写进单片机芯片即可 2. 拔掉JPLED跳线 使LED不显示如图： 3. 实验结果如下图： 4. 按SW19独立按键，倒计时开始 倒计时期间 继电器吸合 按SW20键继电器断开 计时暂停 按板上单片机复位按键 计数值恢复为999 此计数初值 可在程序中修改。
js从10倒数到0的延时器，具有暂停开始功能
yc刺猬的拥抱的博客
06-06 1783
html部分：&lt;body&gt; &lt;button id="start"&gt;开始&lt;/button&gt; &lt;button id="end"&gt;暂停&lt;/button&gt;&lt;/body&gt;js部分：function yehu(){ var i=10; function yh(){ i-=1;//i每次减一 consol
简单10秒倒计时
weixin_43247034的博客
04-21 779
js 代码 var time=document.getElementsByTagName("font")[0].innerText; function starts(){ var timer=setInterval(function(){ if(time>0){ ...
倒计时按钮
poisonous_02的博客
03-28 412
​ ​ ​ ​ ​ ​ ​ 打算记录一下实习半个月以来所遇见的一些小问题，其实都是一些很简单的东西，由于都是一次做相关的功能，难免不能得心应手，以此来记住这些功能是如何实现。其中第一个小问题就是要我做一个常见的发送验证码弹窗中倒计时的按钮如何来做，简单做个弹窗样式，具体如下。 ​ ​ ​ ​ ​ ​ ​ ​公司用的技术是vue加elementui，原本我是打算写一个按
按钮禁用与倒计时
丶坏孩子的博客
05-17 852
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ 开发工具与关键技术：VS MVC 作者：袁志彤 撰写时间：2019-05-16 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ 我写这...
60秒倒计时时钟设计_单片机实现60秒倒计时时钟_六十秒计时_
10-02
根据需求，可能还需要添加开关或按钮来启动和停止计时。 2. **软件设计**：编写单片机程序。这通常涉及到C语言或汇编语言编程。程序的主要任务是初始化单片机、设置定时器中断、处理计数逻辑以及更新LED显示。 - ...
单片机24秒倒计时c语言,关于单片机24秒倒计时添加按键控制程序的问题
weixin_32101177的博客
05-23 2707
给你改成单键控制开始、暂停、继续的24秒倒计时。#include#define uchar unsigned char#define uint unsigned intsbit dula=P2^6;sbit wela=P2^7;sbit key1=P3^4;uchar code table[]={0x3f,0x06,0x5b,0x4f,0x66,0x6d,0x7d,0x07,0x7f,0x6f,0...
51单片机99秒倒计时C语言程序,单片机课程设计-99秒倒计时
weixin_39593061的博客
05-21 6671
单片机应用技术课程设计指导书合肥通用职业技术学院电气与计算机系 二OO九年11月单片机应用是一门很重要的专业课，它涉及到的理论及技术在工业过程控制、智能仪器仪表及家用电器中有非常广泛的应用，本课程设计的意义和目的在于：通过具体的应用实例，进一步将课本知识与实际应用融会、贯通，以达到理论与实践相结合的教学目的。 一． 设计题目 99秒倒计时的设计 二． 总体要求1． 仔细阅读设计任务，根据设计的任务...
点击实现倒计时,按钮变成不可点击,倒计时结束,按钮重新可点击
10-07
点击实现倒计时,按钮变成不可点击,倒计时结束,按钮重新可点击
点击按钮出现60秒倒计时的简单js代码(推荐)
10-22
下面小编就为大家带来一篇点击按钮出现60秒倒计时的简单js代码(推荐)。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
单片机9秒倒计时（成功）
07-02
用单片机做的倒计时程序，大家共同学习，重在参与
Canvas粒子十秒倒计时特效.zip
最新发布
10-05
通过这样的组合，"Canvas粒子十秒倒计时特效"能够为网页带来独特的动态视觉体验，既可用于吸引用户的注意力，也可用于强调重要时刻的到来，如活动开始、产品发布等。这个压缩包中的"jiaoben8709"文件可能是源代码、...
Android获取验证码倒计时实现代码
01-20
这样，当需要停止倒计时时，调用`clearTimer`方法即可。 以上就是Android应用中实现获取验证码倒计时功能的基本步骤。在实际项目中，你可能还需要添加网络请求接口来发送验证码、处理网络错误、验证验证码等逻辑。...
基于89s51和C语言用一个按键做秒表，实现开始、暂停、清零功能。
weixin_46248189的博客
10-16 2734
基于89s51和C语言用一个按键做秒表，实现开始、暂停、清零功能。 具体要求： 1.通过定时器实现10s的秒表显示; 按键功能:首先按键计时开始,再次按键暂停,第三次按键清零。 P3.7引脚接键K1;用P0、P2口分别控制2个数码管显示; PO 显示十位 s ,P2显示个位 ms ;转换状态间隔0.1s。 2.设计单片机程序:选择定时器工作方式1,定时50ms。 程序： #include<reg52.h> #define uint unsigned int sbit key=P3^7; //定义
使用js完成一个60秒倒计时，点击停止时就显示倒计时三个字
Wrj6811的博客
04-02 1805
废话不多说，直接上代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Doc...
JavaScript可以开始和停止的倒计时
Return_KB的博客
02-11 1680
代码如下：&lt;!DOCTYPE html&gt;&lt;html&gt;&lt;head&gt;&lt;meta charset=" utf-8"&gt;&lt;title&gt;倒计时&lt;/title&gt;&lt;style&gt;body, div{  margin:0;  padding:0;}body{  color:#fff;  font:16px/1.5
在输入框里输入一个时间，获得倒计时时间，点击开始计时，便可以开始计时，点击停止计时按钮，则停止计时。
qq_62500885的博客
09-20 474
在输入框里输入一个时间，获得倒计时时间，点击开始计时，便可以开始计时，点击停止计时按钮，则停止计时。
，使用数码管写一个倒计时器，使用按钮可以 设置倒计时时间，倒计时过程中按按钮停止倒计 时，并重新设置倒计时时间，倒计时时间到时，蜂 鸣器响3秒。
05-17
这是一个基于Arduino的示例代码，使用了一个4位数码管、一个按钮和一个蜂鸣器。请确保你已经连接好了这些硬件设备。 ```c++ #include <SevSeg.h> SevSeg sevseg; // 数码管对象 const int buttonPin = 2; // 按钮引脚 const int buzzerPin = 3; // 蜂鸣器引脚 int countdown = 0; // 倒计时时间（秒） bool countdownStarted = false; // 是否已经开始倒计时 bool countdownStopped = false; // 是否已经停止倒计时 bool countdownFinished = false; // 是否已经完成倒计时 void setup() { byte numDigits = 4; // 数码管显示4位数字 byte digitPins[] = {4, 5, 6, 7}; // 数码管的4个引脚 byte segmentPins[] = {8, 9, 10, 11, 12, 13, A0, A1}; // 数码管的7个段的引脚 bool resistorsOnSegments = false; // 数码管的段是否接上了电阻 bool updateWithDelays = false; // 是否使用延时更新数码管的显示 bool leadingZeros = false; // 是否在前面补0 bool disableDecPoint = true; // 是否禁用小数点 sevseg.begin(COMMON_ANODE, numDigits, digitPins, segmentPins, resistorsOnSegments, updateWithDelays, leadingZeros, disableDecPoint); pinMode(buttonPin, INPUT_PULLUP); // 按钮使用内置上拉电阻 pinMode(buzzerPin, OUTPUT); // 蜂鸣器输出 Serial.begin(9600); // 打开串口以便调试 } void loop() { // 读取按钮状态 bool buttonState = digitalRead(buttonPin) == LOW; // 如果按钮被按下并且倒计时没有开始，则设置倒计时时间 if (buttonState && !countdownStarted) { countdown = 10; // 设置倒计时时间为10秒 countdownStarted = true; // 标记已经开始倒计时 countdownStopped = false; // 标记没有停止倒计时 countdownFinished = false; // 标记没有完成倒计时 } // 如果按钮被按下并且倒计时已经开始，则停止倒计时并重新设置倒计时时间 if (buttonState && countdownStarted && !countdownStopped) { countdownStopped = true; // 标记已经停止倒计时 countdown = 5; // 重新设置倒计时时间为5秒 } // 更新数码管的显示 if (!countdownFinished) { sevseg.setNumber(countdown); // 显示倒计时时间 sevseg.refreshDisplay(); // 刷新数码管的显示 } // 如果倒计时已经开始并且没有被停止，则倒计时减1 if (countdownStarted && !countdownStopped && !countdownFinished) { countdown--; // 倒计时减1 if (countdown == 0) { countdownFinished = true; // 标记已经完成倒计时 digitalWrite(buzzerPin, HIGH); // 开启蜂鸣器 delay(3000); // 等待3秒 digitalWrite(buzzerPin, LOW); // 关闭蜂鸣器 } } // 调试信息 Serial.print("Countdown: "); Serial.println(countdown); Serial.print("Countdown started: "); Serial.println(countdownStarted); Serial.print("Countdown stopped: "); Serial.println(countdownStopped); Serial.print("Countdown finished: "); Serial.println(countdownFinished); Serial.println(); } ``` 这个代码主要是通过读取按钮的状态来设置倒计时时间，并且可以在倒计时过程中按下按钮停止倒计时并重新设置倒计时时间。同时，它还会在倒计时结束时开启蜂鸣器响3秒。你可以根据需要修改代码来适应自己的硬件环境。
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值