首先写一个按钮:

<input type="button" id="btn" value="免费获取验证码" onclick="time(this)" />

然后写js代码:

var wait=60;
function time(o){
if (wait==0) {
o.innerHTML="重新发送验证码";
o.style.backgroundColor="#388BE8";
o.removeAttribute("disabled");
wait=60;
}else{
o.setAttribute("disabled", true);
o.innerHTML=wait+"秒后重新获取";
o.style.backgroundColor="#8f8b8b";
wait--;
setTimeout(function(){
time(o)
},1000)
} }

欢迎关注微信公众号:lovephp

js 发送验证码倒计时的更多相关文章

  1. js&jq 发送验证码倒计时

    <input  type="text"   name=''  id="btn"> //发送验证码倒计时var wait=30; function t ...

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

    这是一款基于jquery实现的手机发送验证码倒计时效果代码,可实现实时显示秒数倒计时的功能,还可实现对手机号码格式验证的功能,是一款常用的网站注册发送手机验证码特效代码. 效果描述:注册一个网站,当需 ...

  3. js之验证码倒计时功能

    <!DOCTYPE html> <html > <head> <meta http-equiv="Content-Type" conten ...

  4. react native中的聊天气泡以及timer封装成的发送验证码倒计时

    今天看来情书写的文章,研究了一下大佬写的文章,自己做一点总结. 其实,今天我想把我近期遇到的坑都总结一下:1.goBack的跨页面跳转,又两种方法,一可以像兔哥那样修改navigation源码,二可以 ...

  5. js发送验证码(倒计时)

    需求:在用户点击获取验证码后60s内不能再次获取 代码 //倒计时60秒 var countdown=60; //显示获取验证码倒计时的文本标签 var _generate_code =$(" ...

  6. js实现发送验证码倒计时按钮

    在写注册页面时,有时候需要发送注册邮件来获取验证码,但是为了防止多次重复发送邮件, 必须让按钮隔一段时间后才能再次使用. 代码如下: <html> <head> <met ...

  7. js实现发送验证码倒计时效果

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. 前端 js 发送验证码

    1. 代码如下: <html> <head> <meta charset="utf-8"> <title></title> ...

  9. jQuery实现发送验证码倒计时60秒

    前端HMTL: <div class="form_box"> <div class="line mb40"> <div class ...

随机推荐

  1. Just a Hook(线段树区间更新)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1698 In the game of DotA, Pudge’s meat hook is actual ...

  2. Spark Mllib里的分层抽样(使用map作为分层抽样的数据标记)

    不多说,直接上干货! 具体,见 Spark Mllib机器学习实战的第4章 Mllib基本数据类型和Mllib数理统计

  3. SpringMVC之用注解控制器(一)

    在传统的Spring MVC开发方法中,必须在Bean配置文件中为每个控制器类配置实例和请求映射和让每个控制器类去实现或者扩展特定于框架的接口或者基类,不够灵活. 如果Spring MVC可以自动侦测 ...

  4. mac-httpd

    mac 的httpd mac 自带了apache2, 但是不推荐使用, 因为它的目录在/Library/WebServer/Documents/下 使用brew install apache-http ...

  5. ACdream 1430——SETI——————【后缀数组,不重叠重复子串个数】

    SETI Time Limit: 4000/2000MS (Java/Others) Memory Limit: 128000/64000KB (Java/Others) Submit Statist ...

  6. UICollectionView基础API笔记

    UICollectionView系列API,属性含义笔记.在UICollectionView笔记1中我们了解了UICollectionView是什么,以及可以做什么:在UICollectionView ...

  7. hibernate笔记4--qbc查询

    Criteria:是一种完全面向对象的查询方式,Criteria查询也叫做qbc查询(query by Criteria).         查询全部,分页查询,统计查询,条件查询,排序查询,离线查询 ...

  8. bank conflct 一句话总结

    由于最新的多播模式区别于原来的广播模式,原来同一个warp不同线程访问同一个bank的相同地址不再是bank conflict, 现在总结为:只要同一个 warp 的不同线程会访问到同一个 bank ...

  9. Android ImageView的几种对图片的缩放处理 解决imageview放大图片后失真问题解决办法

    我的解决办法: 1 首先设置android:layout_width=”wrap_content”和android:layout_height=”wrap_content”,否则你按比例缩放后的图片放 ...

  10. WPF样式学习三

    SnapsToDevicePixels 获取或设置在呈现过程,该值来确定呈现此元素是否应使用特定于设备的像素设置. 这是一个依赖项属性. true ,如果元素应以符合呈现到设备像素;否则, false ...