JavaScript获取短信验证码(周期性)

本文实例为大家分享了js周期性获取短信验证码的具体代码,供大家参考,具体内容如下

<!DOCTYPE html>
<html>
<head lang="en">
 <meta charset="UTF-8">
 <title></title>
</head>
<body>
<input type="text"/>
<input type="button" id="btn" value="点击发送验证码"/>
<script>
 var timerId = null;
 var btn = document.getElementById("btn");
 var num = 5;
 btn.onclick = function () {
  btn.disabled = true;
  timerId = setInterval(function () {
   num--;
   btn.value = num + "秒后可以发送";
   if (num === 0) {
    clearInterval(timerId);
    btn.value = "点击发送验证码";
    btn.disabled = false;
    num = 5;
   }
  }, 1000);
 };
</script>
</body>
</html>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

(0)

相关推荐

  • js实现简单的获取验证码按钮效果

    效果图: 图(1)初始图 图(2)点击后 代码如下: <!DOCTYPE HTML> <html> <head> <meta charset="UTF-8" /> <title>pro.html</title> <style type="text/css"> .checkCode { cursor: pointer; border: 1px solid black; text-ali

  • 纯js实现重发验证码按钮倒数功能

    代码一: <!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="Con

  • Js实现手机发送验证码时按钮延迟操作

    实例代码记录: <script type="text/javascript"> function start_sms_button(obj){ var count = 1 ; var sum = 30; var i = setInterval(function(){ if(count > 10){ obj.attr('disabled',false); obj.val('发送验证码'); clearInterval(i); }else{ obj.val('剩余'+pa

  • JS实现用户注册时获取短信验证码和倒计时功能

    在用户注册时,通常需要短信验证码,而且为了交互效果,也需要增加倒计时. 效果如下: <div class="user-form"> <form action="{{ path('zm_member_register') }}" method="post"> <div class="form-list"> <label class="register-label"&g

  • JS/jQ实现免费获取手机验证码倒计时效果

    最近做了一个项目,其中有项目需求涉及到手机号验证码,就是当用户点击获取验证码之后我们会发送一条信息到用户手机,然后就会出现一个倒计时按钮,很像支付宝手机付款效果了,下面我给大家分享两个实现代码. 如何获取手机验证码? 小月不知道大家是利用什么平台去获取验证码的,但是告诉大家我是在哪个平台获取的. LeanCloud :https://leancloud.cn/ 文档:https://leancloud.cn/docs/sms_guide-js.html 在这个平台首先去要注册一个账号,在设置里面

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

    网站中为了防止恶意获取验证短信.验证邮箱,都会在点击获取验证码的按钮上做个倒计时的效果.实现这个功能,一个setInterval和一个clearInterval就能搞定了,不需要太多的代码.实例效果和代码如下: <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <input type="button" style="height:

  • JavaScript获取短信验证码(周期性)

    本文实例为大家分享了js周期性获取短信验证码的具体代码,供大家参考,具体内容如下 <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> </head> <body> <input type="text"/> <input type=

  • javascript发送短信验证码实现代码

    本文首先分析手机发送验证码的原理,再对javascript发送短信验证码予以实现,具体思路如下: 实现点击"发送验证码"按钮后,按钮依次显示为"59秒后重试"."58秒后重试"-直至倒计时至0秒时再恢复显示为"发送验证码".在倒计时期间按钮为禁用状态 . 第一步.获取按钮.绑定事件.设置定时器变量和计时变量 第二步.添加定时器,每隔1秒钟计时减 1,直至当计时小于等于 0 时清除定时器,按钮恢复为"发送验证码&quo

  • Android如何通过手机自动获取短信验证码

    本文实例为大家分享了Android实现手机自动获取短信验证码功能,供大家参考,具体内容如下 1.短信监听广播 2.读取短信内容 3.截取短信内容[可以 reg截取] 4.填写至相应控件 PS:DevStore测试没有获取到验证码 源码片段 public class MainActivity extends Activity { private BroadcastReceiver smsReceiver; private IntentFilter filter2; private Handler

  • Android获取短信验证码的实现方法

    先给大家展示下效果图,如果感觉不错,请参考实现思路详解 Android开发中关于短息验证码的设计层出不穷,越来越多的应用为了更好的提高软件的安全性,开始使用通过服务器向用户发送验证码的方式,来保护用户个人信息的安全性.无论是用户注册时的信息验证还是当用户发出找回密码请求时的短信验证,他们的工作原理大致上是一致的,因为项目的需要研究了一下关于这方面的知识,本篇我将带领大家一起实现这一当下流行的设计方案. 众所周知,短信验证需要服务器端生成一个验证码,然后发送到用户输入的手机上,这个过程需要服务器主

  • Android开发之获取短信验证码后按钮背景变化并且出现倒计时

    目前越来越多的app在注册或是进行对应操作时,要求获取短信验证码,在点击了获取短信验证码的按钮后,就是出现倒计时,比如倒计时120S,在倒计时期间内,按钮背景变化并且出现倒计时,当倒计时结束后,如果你没有获取到验证码,可以再次点击. 代码如下所示: VerCodeTimer mVerCodeTimer=(Button) findViewById(R.id.login_get_ver_code); private class VerCodeTimer extends CountDownTimer

  • JS获取短信验证码倒计时的实现代码

    废话不多说了,直接给大家贴代码了,具体代码如下所示: $(function() { var phone_num = /^1\d{10}$/; var flag = 1; //短信发送时标志位 $(".getcode").click(function() { if($("#phone").val() == "") { alert("请输入电话号码!"); return false; }; if(!phone_num.test($

  • jquery实现表单获取短信验证码代码

    效果图: 代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>jquery表单获取短信验证码代码</title> <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script&g

  • Android手机号注册、绑定手机号获取短信验证码实例

    本文写了一个常见的功能--手机app中注册或绑定手机号的获取验证码的功能,也就是短信验证功能 具体效果就是,你在注册界面填写手机号,点击获取验证码按钮,---然后会收到验证短信,填入验证码后点击注册按钮,如果验证正确就可以跳转到另外一个界面 1.首先大家需要在mob官网注册一个账号,mob是一个免费的短信验证平台 2.在mob.com后台创建应用 3.下载对应的sdk 4.将sdk作为一个library导入到你的项目中 5.现在就可以在你的项目中编写代码使用mob提供的这个功能了 具体代码如下:

  • Android自动获取短信验证码功能

    先给大家展示下效果图,如果大家感觉不错,请参考实现代码. 1.自定义监听类 /** * 短信监听器,用于自动填充验证码 */ public class SMSContentObserver extends ContentObserver { public final String SMS_URI_INBOX = "content://sms/inbox";//收信箱 private Activity activity = null; private String smsContent

随机推荐