js倒计时

最新推荐文章于 2024-05-22 01:53:01 发布
最新推荐文章于 2024-05-22 01:53:01 发布
阅读量130 收藏
点赞数
分类专栏： js工具
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_33421902/article/details/83062374
版权

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>注册</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<meta name="renderer" content="webkit">
<meta http-equiv="Cache-Control" content="no-siteapp" />
<script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
</head>
<body>
    <!-- 获取验证码 -->
    <div>
        <input type="text" placeholder="请填写手机号"> <input type="button" value="获取验证码" id="sendBtn" οnclick="time()">
    </div>
</body>
<script type="text/javascript">
    var wait = 60;
    function time() {
        if (wait <= 0) {
            $("#sendBtn").text("获取验证码");
            $("#sendBtn").css("color", "#0c3981");
            wait = 60;
        } else {
            $("#sendBtn").val(wait + "秒后重发");
            $("#sendBtn").css("color", "#8a8d92");
            wait--;
            setTimeout(function() {
                time();
            }, 1000);
        }
    }
</script>
</html>

页面中的jquery需要在外部引入

qq_33421902
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
用js做一个倒计时(时分秒),js中倒计时器怎么实现
wenangou的博客
11-14 5283
1.核心算法：输入的时间减去现在的时间就是剩余的时间，即倒计时 ，但是不能拿着时分秒相减，比如 02 分减去22分，结果会是负数的，所以要转换为毫秒；2.用时间戳来做，用户输入时间总的毫秒数减去现在时间的总的毫秒数，得到的就是剩余时间的毫秒数；3.把剩余时间总的毫秒数转换为天、时、分、秒 （时间戳转换为时分秒）。利用JavaScript函数做一个简单的倒计时。
等待下班js倒计时特效代码
03-20
等待下班js倒计时代码是一款可以自定义下班时间，到时间自动提示。
js几种倒计时实现方式
douyiqing的博客
04-02 9011
1. 常见获取验证码60s倒计时 var second = 60; var timer; // 倒计时 function countDown(){ second--; if(second == 0){ second = 60 clearTimeout(timer) return } timer = s...
js 倒计时器（保姆级教程）
最新发布
m0_66729991的博客
05-22 638
utils文件夹中创建index.js 文件。2. main.js 挂载全局。1. 倒计时器封装的方法。
JS实现倒计时功能
热门推荐
qq_48954625的博客
12-27 4万+
一、前言 网站在做活动时，会出现一个截止时间倒计时的提示。效果如图： 二、分析 ①提示时间是每秒不断变化的，需要用到定时器(setInterval) //1000表示每隔一秒变化一次，单位为毫秒 setInterval(countDown, 1000); ②三个盒子通过innerHTML进行赋值，放入时、分、秒 ③计算当前时间到截至时间的时间（时间戳：指的不是当前时间，而是距离1970年1月1号过了多少毫秒） +new Date() ④截止时间的时间戳减当前时间的时间戳 ⑤通过..
vue之事件绑定
deep_zhuheihei的博客
07-20 298
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Doc
javascript 倒计时代码
10-29
JavaScript 倒计时代码详解 在本篇文章中，我们将深入探讨 JavaScript 倒计时代码的实现 principio 和应用场景。通过分析给定的代码，我们将了解到倒计时代码的基本结构、计时机制、显示...* JavaScript倒计时应用场景
简单实现JS倒计时效果
11-27
在JavaScript中，倒计时是一种常见的功能，常用于事件预告或者特定时间的提醒。本篇文章将探讨如何使用JS实现一个简单的倒计时效果。 首先，我们看标题和描述中的示例代码，这是一个基本的HTML文件，包含了一个...
JS倒计时_javascript倒计时
02-17
JS倒计时
Javascript倒计时代码
10-28
JS脚本是在网上找到的，然后进行了改进，弥补了不足之处。
js倒计时显示实例
10-20
本文分享了js倒计时显示的实例，需要的朋友可以参考借鉴，下面就跟小编一起来看看吧
javaScript实现倒计时功能
qq_65715980的博客
07-08 1万+
目录一、主要思路二、css样式三、html代码四、js内容五、完整代码展示六、效果展示1.通过内置时间函数实例化日期对象获取当前时间 new Date。2.因为时间无法减去时间，有可能生成负数，所以采用时间戳的方法得到毫秒数形式的剩余时间，然后再把剩余时间转换为天、时、分、秒格式。3.最后把所获得的内容赋值给定义的变量。主要为了内容在页面展示美观，稍微美化一下。 三、html代码 定义一个默认格式为JavaScript引入定义变量。 四、js内容 1.首先获取html里面的spans里的全部标签
JS实现倒计时效果
m0_55531470的博客
08-19 1万+
案例分析： 1、倒计时效果是不断变化的，因此我们需要定时器来自动变化(setInterval) 2、三个黑盒子里面分别存放时、分、秒 3、三个黑盒子利用innerHTML放入计算的小时、分钟、秒数 4、(程序读取需要时间)第一次执行也是间隔毫秒数，因此刷新页面时会有空白 5、最好采用封装函数的方式，这样先调用一次这个函数，防止刚开始刷新页面有空白问题 6...
JS倒计时两种种实现方式
Cover_face
08-10 1771
一：设置时长，进行倒计时。比如考试时间等等 代码如下： <html> <head> <meta charset="UTF-8"> <title>简单时长倒计时</title> <SCRIPT type="text/javascript"> var maxtime = 60 * 60; //一个小时，按秒计算，自己调整! function
js实现倒计时
MrHao_的博客
04-29 1682
js实现倒计时： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <tit
JS实现倒计时和短信验证码倒计时功能
weixin_50367873的博客
06-19 3694
html30分钟倒计时。短信验证码倒计时功能。
Js时间倒计时
是个非常热爱生活、乐观、奋斗、努力的逗比青年
06-29 1525
在JavaScript中，时间倒计时 下面代码会创建一个定时器，每秒钟更新一次倒计时，不是能难，记住关键字，运用关键字。好了，js实现倒计时，就写到这了，如果有不对的地方，希望多多指出，望与诸君共同进步！
javascript倒计时
12-12
以下是一个JavaScript倒计时的例子： ```javascript // 获取所有的span元素 var spans = document.querySelectorAll('span'); // 设置倒计时结束时间 var endTime = new Date('2022-10-1 12:00:00').getTime(); // 定义倒计时函数 function countdown() { // 获取当前时间 var newTime = new Date().getTime(); // 计算剩余时间 var diffTime = (endTime - newTime) / 1000; // 计算剩余天数、小时数、分钟数、秒数 var days = Math.floor(diffTime / (60 * 60 * 24)); var hours = Math.floor((diffTime % (60 * 60 * 24)) / (60 * 60)); var minutes = Math.floor((diffTime % (60 * 60)) / 60); var seconds = Math.floor(diffTime % 60); // 更新页面上的倒计时 spans[0].textContent = days; spans[1].textContent = hours; spans[2].textContent = minutes; spans[3].textContent = seconds; } // 每秒钟更新一次倒计时 setInterval(countdown, 1000); ``` 这个例子会在页面上显示一个倒计时，显示剩余的天数、小时数、分钟数和秒数，直到指定的结束时间。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值