同意按钮，倒计时10秒

最新推荐文章于 2022-02-28 00:43:47 发布
最新推荐文章于 2022-02-28 00:43:47 发布
阅读量175 收藏
点赞数
文章标签： xhtml
原文链接：http://www.cnblogs.com/wangchuanqi/p/5323235.html
版权 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>

<body>
<form>
<input type="submit" id="t" value="同意（9）"  disabled="disabled" />
</form>
</body>
</html>
<script>
var n=10;
var a=document.getElementById("t");
function bian()
{
    n--;
    if(n==0)
    {
        a.removeAttribute("disabled");
        a.value="同意";
        return;
        
        }
    else
    {
        a.value="同意（"+n+"）";
        window.setTimeout("bian()",1000);
        }
    }
window.setTimeout("bian()",1000);
</script>
View Code

转载于:https://www.cnblogs.com/wangchuanqi/p/5323235.html

diaozhanang6473
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
超详细！使用HTML、CSS、JavaScript实现倒计时。附加功能——点击页面出现小心心
qq_43512726的博客
06-06 2940
写在开头的感谢： 感谢 @Destiny_1853 的灵感和获取时间的代码提供。 感谢 @扰扰 的页面点击出现小心心的代码提供。 本次，我们准备写一个有关倒计时的小例子，正好最近在进行前端实训，学习了HTML和CSS，因此就在这里先实操一下 1、本次倒计时我们准备采用，天 时 分 秒 四个时间来进行计时。 利用 span 标签，分别设置各个时间。 HTML实现代码如下： <!-- 天 --> <span class="top_1">DAYS</span><
同意按钮，倒计时10秒，同意按钮变为可提交的
weixin_30408309的博客
03-26 169
HTML代码： 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml">...
注册页面时倒计时多少秒以后同意按钮可用
雨林
09-13 653
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> http://www.w3.org/1999/xhtml"> 注册页面 var leftSeconds = 10; var intervalId
同意倒计时
weixin_30624825的博客
09-28 142
<body> <form> <input type="submit" id="a" value="同意(10)" disabled="disabled" /> </form> </body></html><script> n=10; a=document.getElementById("a"); fun...
前端按钮倒计时
WuQingLaoXingXing的博客
10-31 401
好长时间没有写博客了，今天看着一个小功能就动手玩了一下，直接上代码。 <template> <div> searchContainer <mt-button :type="type" size="small" :disabled='flag' @click="test" style="width:80px;">{{val...
JS自动倒计时30秒后按钮才可用(两种场景)
11-24
WEB开发中经常会用到倒计时来限制用户对表单的操作，比如希望用户在一定时间内看完相关协议信息才允许用户继续下一步操作，又比如在收取手机验证码时允许用户在一定时间过后（未收到验证码的情况下）再次获取验证码...
JS点击按钮自动倒计时特效代码
03-20
2. 当用户点击“同意”按钮时，启动倒计时函数，例如设置一个定时器，每隔一定时间更新按钮的文本，并检查是否达到设定的时间限制。 3. 倒计时结束后，移除按钮的`disabled`属性，使按钮变为可点击状态。 ```...
js实现点击注册按钮开始读秒倒计时的小例子
12-12
//设置秒数(单位秒) var secs_time = 0; for(var i=1;i<=wait_time;i++) { window.setTimeout(“sTimer(“+i+”)”,i*1000); } function sTimer(num) { if(num==wait_time) { document.getElementById(“reg_...
JS点击按钮自动倒计时代码.zip
07-05
3. 倒计时逻辑：当点击按钮后，启动一个定时器（setTimeout或setInterval），更新按钮文本显示剩余时间，并在时间到时解除按钮的禁用状态。 4. 可能会使用`clearTimeout`或`clearInterval`来取消已设置的定时器，以...
js实现用户注册协议倒计时的方法
12-10
本文实例讲述了js实现用户注册协议倒计时的方法。分享给大家供大家参考... //用户有十秒钟的时间看协议，超过十秒钟，“同意”按钮将生效   var Seconds = 10;   //计时器ID   var setIntervalID;   function
协议同意倒计时按钮
08-30 613
注册 注册协议 var leftSeconds = 5; var intervalID; function Count() { var btnRag = document.getElementById("btnRag")
简易的计时器实例，可以模拟注册协议倒计时同意
海洋专栏
03-20 753
无标题文档   var a=3;   var jishi=function() { document.getElementById("agr").value = a+"秒后可以同意";      a--; if(a ==0) {  clearTimeout(null); document.getElementById("agr").style.color="red"; docu
前端点击按钮触发计时器
python_web全栈
02-02 3793
一：前后端分离项目vue中的计时器 html <el-input placeholder="请输入验证码" v-model="sms_code"> <template slot="append"> <el-button type="success" round @click="sms_btn" :disabled="sms_status">{{ sms_info }}</el-button>
如何给按钮设置倒计时？
qq_46582421的博客
06-24 1152
口水话少说，直接上代码： <form style="padding: 5px 10px; color: #338fff;"> <input disabled="disabled" type="checkbox" value="注册" id="button" /> <span style="color: red;">*</span>本人已认真阅读以上条款。不存在以上情形。 <span id="countdown" style="color: red;
前端开发：在vue中实现按钮倒计时功能
软贱开发攻城狮
02-28 3785
前言 在vue中开发中，关于计时器的使用也是比较常见的知识点，如基于移动端的短信60秒倒计时按钮、阅读协议40秒等实际需求，很常见的需求也不复杂，主要是有些细节需要注意。那么本篇博文就来分享一下关于vue中实现倒计时功能的方法，方便查阅使用，如有问题请指正。 使用场景 在前端开发中基于移动端的短信验证码发送60s倒计时使用，用户协议阅读30s倒计时提示等等。 核心原理 主要要处理的是倒计时按钮提示的数字以及倒计时结束之后的提示文字，以及计时器来进行倒计时使用，以及标签层面和js中按钮触
计数器函数-注册倒计时
qq_45579661的博客
09-12 394
1.注册按钮倒计时 <!DOCTYPE html> <html lang="zh-CN"> <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"> &
winform界面button倒计时
weixin_30624825的博客
11-18 827
添加一个button和一个timer控件即可。 private int leftTime = 5; private void timer1_Tick(object sender, EventArgs e) { button.Enabled = false; if (leftT...
vue按钮倒计时5秒后可用
最新发布
06-02
您可以通过以下步骤实现Vue按钮倒计时5秒后可用： 1. 定义一个变量`countdown`来表示倒计时的秒数，初始值为5。 2. 在按钮的`@click`事件中，将按钮禁用，并启动一个定时器`timer`，每隔1秒将`countdown`减1。 ``` <template> <button @click="handleClick" :disabled="disabled">{{ buttonText }}</button> </template> <script> export default { data() { return { countdown: 5, disabled: false, buttonText: '点击按钮', timer: null } }, methods: { handleClick() { this.disabled = true; this.timer = setInterval(() => { this.countdown--; if (this.countdown === 0) { clearInterval(this.timer); this.disabled = false; this.countdown = 5; this.buttonText = '点击按钮'; } else { this.buttonText = `倒计时 ${this.countdown} 秒`; } }, 1000); } } } </script> ``` 3. 在定时器中，每次更新按钮文字时检查`countdown`的值，如果为0，则清除定时器，并将按钮重新启用。 4. 在按钮文字中显示当前的倒计时时间，以便用户知道何时可以再次点击按钮。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值