html 按钮点击倒计时,限制不可点击

news2024/11/17 22:42:49

html 按钮点击倒计时,限制不可点击

e94cbabd25cfc7f3f53a50a235734c22.jpg

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title></title>
    </head>
    <body>

        <!-- VVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVV -->
        <!-- VVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVV -->
        <input type="button" style="height:32px;width:120px;" value="点击发送验证码" onclick="sendCode(this)" />
        <script type="text/javascript">
            var clock = '';
            var nums = 3;
            var btn;

            function sendCode(thisBtn) {
                btn = thisBtn;
                btn.disabled = true; //将按钮置为不可点击
                btn.value = nums + '秒后可重新获取';
                clock = setInterval(doLoop, 1000); //一秒执行一次
            }

            function doLoop() {
                nums--;
                if (nums > 0) {
                    btn.value = nums + '秒后可重新获取';
                } else {
                    clearInterval(clock); //清除js定时器
                    btn.disabled = false;
                    btn.value = '点击发送验证码';
                    nums = 3; //重置时间
                }
            }
        </script>
        <!-- AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA -->
        <!-- AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA -->

    </body>

</html>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1113161.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Ubuntu20.4 设置代理

主要是涉及2个代理 涉及apt 可以在、/etc/apt/apt.conf 中进行修改 在系统全局可以在/etc/profile中进行修改

2023年最新全国各省行政区划数据(省-市-区县-乡镇-村)

背景 现实情况&#xff0c;在信息系统开发、电子商务平台、app等等相关软件开发&#xff0c;都会设计到行政区数据联动&#xff0c;这里已经爬好全国各省行政区划数据可供下载。 数据来源 内容为2023年全国统计用区划代码&#xff08;12位&#xff09;和城乡分类代码&#xff…

跨境电商:产业带的深度赋能

近年来&#xff0c;中国跨境电商平台崭露头角&#xff0c;成为推动国内产业带转型升级和出海的新引擎。这一充满活力的领域不仅让中国制造走向世界&#xff0c;也为国内众多产业提供了数字化升级的机会&#xff0c;实现了“小单快反”和按需供应。 专业跨境电商平台如SHEIN和阿…

RabbitMQ整理

MQ(Message Queue)&#xff1a;是队列&#xff0c;也是跨进程的通信机制&#xff0c;用于上下游传递信息 FIFO(First In First Out)&#xff1a;先进先出 RabbitMQ访问&#xff1a;http://127.0.0.1:15672/ 默认账号密码&#xff1a;guest 优势&#xff1a;流量削峰&#x…

计网----使用代码实现C/S模型的数据通信,IP地址分类,子网掩码,网关,广播地址,非默认子网掩码,子网划分的常见问题

计网----使用代码实现C/S模型的数据通信,IP地址分类,子网掩码,网关,广播地址,非默认子网掩码,子网划分的常见问题 一.使用代码实现C/S模型的数据通信&#xff08;七层网络系统的博客https://blog.csdn.net/m0_73483024/article/details/133916201?spm1001.2014.3001.5502的后…

completablefuture的使用

CompletableFuture使用详解 【Java异常】Variable used in lambda expression should be final or effectively final CompletableFuture原理与实践-外卖商家端API的异步化 项目描述 项目接口需要从下游多个接口获取数据&#xff0c;并且下游的网络不稳定还会涉及到循环调用…

DC电源模块的模拟电源对比数字电源的优势有哪些?

BOSHIDA DC电源模块的模拟电源对比数字电源的优势有哪些&#xff1f; DC电源模块是一种电子元件&#xff0c;用于将交流电转换为直流电&#xff0c;以供电路板、集成电路等电子设备使用。在直流电源模块中&#xff0c;有模拟电源和数字电源两种类型。 模拟电源是一种传统的电源…

如何使双核心的ESP32开启双核功能同时执行多任务

如何使双核心的ESP32开启双核功能同时执行多任务 简介查看ESP32当前哪一个内核在执行任务双核同时执行任务总结 简介 ESP32-WROOM-32模组内置两个低功耗 Xtensa 32-bit LX6 MCU&#xff0c;两个 CPU 核&#xff08;core 0与core 1&#xff09;可以被单独控制。可以在两个内核上…

PHP数据加密传输和存储问题

PHP数据加密的类型 md5()&#xff0c;sha1()&#xff0c;crypt() 双md5加密加盐

2、Kafka 生产者

3.1 生产者消息发送流程 3.1.1 发送原理 在消息发送的过程中&#xff0c;涉及到了两个线程——main 线程和 Sender 线程。在 main 线程 中创建了一个双端队列 RecordAccumulator。main 线程将消息发送给 RecordAccumulator&#xff0c; Sender 线程不断从 RecordAccumulator 中…

内衣洗衣机有危害吗?迷你洗衣机热销第一名

现在洗内衣内裤也是一件较麻烦的事情了&#xff0c;在清洗过程中还要用热水杀菌&#xff0c;还要确保洗衣液是否有冲洗干净&#xff0c;还要防止细菌的滋生等等&#xff0c;所以入手一款小型的烘洗全套的内衣洗衣机是非常有必要的&#xff0c;专门的内衣洗衣机可以最大程度减少…

vue3 + axios 中断取消接口请求

前言 最近开发过程中&#xff0c;总是遇到想把正在请求的axios接口取消&#xff0c;这种情况有很多应用场景&#xff0c;举几个例子&#xff1a; 弹窗中接口请求返回图片&#xff0c;用于前端展示&#xff0c;接口还没返回数据&#xff0c;此时关闭弹窗&#xff0c;需要中断接…

【神印王座】伊莱克斯现身,龙皓晨获得一传承,圣采儿却惨遭反噬

Hello,小伙伴们&#xff0c;我是小郑继续为大家深度解析国漫资讯。 神印王座第78集的预告片更新&#xff0c;一个神秘人物伊莱克斯突然现身&#xff0c;他是一个实力强大、统兵能力卓越的统帅&#xff0c;更拥有令人闻风丧胆的亡灵大军。这个传奇人物被誉为永恒之塔的主人&…

Linux下的命令行参数和环境变量

命令行参数 什么是命令行参数 命令行参数是指在执行命令行程序时&#xff0c;给程序传递的额外参数。在Linux终端中&#xff0c;命令行参数通常通过在命令后面添加空格分隔的参数来传递。 Linux下以main函数举例说明 #include<stdio.h>int main(int argc char* argv[])…

svg常用属性及动画效果

文章目录 引言一、什么是svg二、svg有哪些应用场景三、基本使用四、svg常用属性介绍1. viewBox2. preserveAspectRatio3. symbol标签4.transform1. translate2.scale3.rotate4.skewX和skewY 5. matrix6.stroke-dasharray 五、svg动画1. svg属性结合css动画2. animate 标签动画3…

【网络】网络编程套接字(一)

网络编程套接字 一 一、网络编程中的一些基础知识1、认识端口号2、认识TCP协议和UDP协议3、网络字节序 二、socket编程1、sockaddr结构2、简单的UDP网络程序Ⅰ、服务器的创建Ⅱ、运行服务器Ⅲ、关于客户端的绑定问题Ⅳ、启动客户端Ⅴ、本地测试Ⅵ、网络测试 一、网络编程中的一…

20款VS Code实用插件推荐

前言&#xff1a; VS Code是一个轻量级但功能强大的源代码编辑器&#xff0c;轻量级指的是下载下来的VS Code其实就是一个简单的编辑器&#xff0c;强大指的是支持多种语言的环境插件拓展&#xff0c;也正是因为这种支持插件式安装环境开发让VS Code成为了开发语言工具中的霸主…

升级常有,错误不可避免!更新升级时遇到的错误0x800F081F–0x20003如何修复

Windows更新错误0x800F081F–0x20003主要发生在升级Windows 11/10副本时。这是由于在计算机上启用各种与开发人员相关的设置时出现错误造成的。安装程序遇到的错误被表述为以下任一错误: 我们无法安装Windows 11/10。SAFE_OS阶段的安装失败,INSTALL_UPDATES操作期间出现错误:…

解除OU屏蔽(EBS检查无法直接查询解决)

解除OU屏蔽(EBS检查无法直接查询解决) 具有OU屏蔽的例子 SELECT t.org_id, t.* FROM po.po_headers_all t -- 无屏蔽表&#xff0c;在PL/SQL运行有数据 SELECT t.org_id, t.* FROM apps.po_headers t -- 包含OU屏蔽&#xff0c;在PL/SQL中查询无数据多组织屏蔽原理 1. 在…

免费SSL证书与付费SSL证书的区别

SSL&#xff08;安全套接层&#xff09;证书是网站安全性的关键组成部分&#xff0c;用于保护数据的机密性和完整性。当您考虑在您的网站上部署SSL证书时&#xff0c;您将面临一个重要的决策&#xff1a;是选择免费SSL证书还是付费SSL证书&#xff1f;本文将帮助您理解这两者之…