js实现免费获取手机验证码倒计时效果

<div class="input">
    <input type="button" id="btn" class="btn_mfyzm" value="免费获取验证码" />
   <script type="text/javascript">
var wait=5;
document.getElementById("btn").disabled = false;
function time(o) {
        if (wait == 0) {
            o.removeAttribute("disabled");
            o.value="免费获取验证码";
            wait = 5;
        } else {
            o.setAttribute("disabled", true);
            o.value="重新发送(" + wait + ")";
            wait--;
            setTimeout(function() {
                time(o)
            },
            1000)
        }
    }
document.getElementById("btn").onclick=function(){time(this);}
</script>
</div> 

这个只是延时多久,具体调用短信接口,比如我的短信发送函数是sendMsg,那么这句应该这样写document.getElementById("btn").onclick=function(){sendMsg(time(this));} 具体的情况大家自己变通,希望可以帮助大家!

时间: 2024-07-29 17:35:30

js实现免费获取手机验证码倒计时效果的相关文章

js/jq实现获取手机验证码倒计时效果

众所周知在前段的工作中注册信息或获取当前手机号信息等需求,我们基本上都要涉及到手机号验证码,在网络上搜索的案例杂乱无章,用的时候全是坑,真心不想用了,然后自己写了一个获取手机验证码的倒计时效果.有需求的伙伴们可以看看怎么实现的. 如何获取手机验证码? 小月不知道大家是利用什么平台去获取验证码的,但是告诉大家我是在哪个平台获取的. LeanCloud :https://leancloud.cn/ 文档:https://leancloud.cn/docs/sms_guide-js.html 在这个平

jquery实现获取手机验证码倒计时效果

<!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><script src="http://cdn.bootc

获取手机验证码倒计时那些事

获取手机验证码倒计时 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>获取验证码</title> <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-sca

jQuery实现的手机发送验证码倒计时效果代码分享

这是一款基于jquery实现的手机发送验证码倒计时效果代码,可实现实时显示秒数倒计时的功能,还可实现对手机号码格式验证的功能,是一款常用的网站注册发送手机验证码特效代码. 效果描述:注册一个网站,当需要发送验证码到手机上的时候,我们经常碰到这样的效果:首先检测手机是否符合1开头,11位数字的格式:若不符合,则提示错误信息并返回false:否则提交给后台,后台确定接收后返回一个值,发送按钮变为灰色并倒计时. 运行效果: 年利率高达14.4% 上海投融理财,20万起投,年化收益14.4% 房产抵押,

Andorid实现点击获取验证码倒计时效果

这篇文章主要介绍了Andorid实现点击获取验证码倒计时效果,这种效果大家经常遇到,想知道如何实现的,请阅读本文 我们在开发中经常用到倒计时的功能,比如发送验证码后,倒计时60s再进行验证码的获取,为了方便以后使用,这里做个记录,讲讲倒计时器的实现. 1.先进行倒计时工具类的封装 1 public class CountDownTimerUtils extends CountDownTimer { 2 private TextView mTextView; 3 4 /** 5 * @param

安卓发送验证码倒计时效果和自动获取验证码并填充到输入框

在注册,实名认证.修改手机号码的,我们都会用发送验证码的功能,在这里经常就会涉及到2个效果, 第一个:发送验证码倒计时效果: 第二个:自动获取接收到的短信,并且填充验证码. 先来说倒计时效果: 其实很简单,就是一个计时器.每秒刷新一次,倒计时完了.就可以重新点击获取了. <pre name="code" class="java">btn_getYzm.setEnabled(false); btn_getYzm.setBackgroundResource(

用CountDownTimer实现获取手机验证码效果

简述: CountDownTimer类用来实现倒计时效果. 构造方法接收两个参数,第一个设置倒计时长度,第二个设置倒计时间隔. 用此方法时只需复写onTick()和onFinish()这两个方法即可. 示例: package com.example.androidtest; import android.app.Activity; import android.graphics.Color; import android.os.Bundle; import android.os.CountDow

倒计时按钮—获取手机验证码按钮

HTML:  <input type="button" value="获取验证码">  CSS: 1 input[type=button] { 2 width: 150px; 3 height: 30px; 4 background-color: #ff3000; 5 border: 0; 6 border-radius: 15px; 7 color: #fff; 8 } 9 10 input[type=button].on { 11 backgroun

React中发送验证码 倒计时效果组件编写

(1)可以通过使用"react-timer-mixin"插件实现倒计时效果,原理同下面的思路一样此处不在详细解说 (2)自己用原生定时器方法实现 1 import React,{Component} from 'react'; 2 import {Button } from 'antd-mobile'; 3 import PropTypes from 'prop-types'; 4 class SendVerifyCode extends Component{ 5 constructo